2016-12-10 4 views
0

はどのように私はプログラム的にJavaScriptで彼らは私が小さい地物をクリックしたこの写真では、重複機能のためGoogleは、

enter image description here

に重なったときに互いの上にある機能を定義しますためしかし、情報をマップします外側の地理的特徴が浮かび上がった。私はプログラム的に小さいフィーチャーを上に置きたいと思っています。ここで

がjavascript-

map.data.loadGeoJson('<path to my geojson definition>'); 
map.data.setStyle(function (feature) { 
    let color = 'gray'; 
    console.log(feature); 
    if (feature.getProperty('isColorful')) { 
    color = 'blue'; 
    } 
    return ({ 
    fillColor: color, 
    strokeColor: color, 
    strokeWeight: 1 
    }); 
}); 

map.data.addListener('click', function (event) { 
    let name = event.feature.getProperty('name'); 

    let contentString = '<h4>Polygon Info</h4><br>'; 

    contentString += '<p>'; 
    if (name) { 
    contentString += '<b>Name:</b>' + name + '<br>'; 
    }   
    contentString += '</p>'; 

    let infowindow = new google.maps.InfoWindow({ 
    content: contentString, 
    position: event.latLng 
    }); 

    infowindow.open(map); 

    event.feature.setProperty('isColorful', true); 
}); 

ノートにマップを移入するために私のコードで私はにGeoJSONファイル自体に機能の順序を逆にし、それが動作を変更しませんでした。

答えて

2

あなたは、あなただけの適切な値

return ({ 
    fillColor: color, 
    strokeColor: color, 
    strokeWeight: 1, 
    zIndex: zIndex 
}); 

をうまく、setStyle()機能であなたの必要性に応じて、Zインデックスを調整することができ、他の1つの特徴エントリをdisinguishできfeature.Assumingのzインデックスプロパティを使用することができますマウスが入るとz-インデックスを更新する

map.data.addListener('mouseover', function(e) { 
    map.data.overrideStyle(e.feature, { 
    //strokeColor: '#1e3a2a', 
    //strokeWeight: 2, /* can also change these like hover effect */ 
    zIndex: 6 
    }); 
}); 

map.data.addListener('mouseout', function(e) { 
    map.data.revertStyle(); 
}); 
関連する問題