Witam!
mam mały problem, mianowicie przerobiłem lekko kod mapboxa, który miał zmieniać kolor danego utworzonego kształtu gdy znajdzie się w nim marker.
skrypt działa, lecz zmienia kolor wszystkich kształtów a miałby robić to tylko dla tego w którym jest marker.
prosiłbym o pomoc jak to wykonać. ponizej cały kod:
<!DOCTYPE html>
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' /> <script src='https://api.tiles.mapbox.com/mapbox.js/v1.6.2/mapbox.js'></script> <link href='https://api.tiles.mapbox.com/mapbox.js/v1.6.2/mapbox.css' rel='stylesheet' />
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }
#state {
position:absolute;
top:10px;
right:10px;
background:#fff;
font-size:30px;
padding:10px;
z-index:999;
}
var map = L.mapbox.map('map', 'examples.map-9ijuk24y')
.setView([60, -102.0], 5);
var geoobj = [{
"type":"Polygon",
"properties": { "e": "1" },
"coordinates":[[[100,20],[129.5,10.5],[130.5,21],[110,20]]]
},
{
"type":"Polygon",
"properties": { "e": "2" },
"coordinates":[[[30,40],[11.5,4.5],[-31.5,41],[10,30]]]
}
];
var states = L.geoJson(geoobj, {color: "#ff7800", weight: 1}).addTo(map);
L.marker([10, 122], {
icon: L.mapbox.marker.icon({
'marker-color': '#f22'
}),
draggable: true
}).addTo(map)
.on('dragend', function(e) {
var layer = leafletPip.pointInLayer(this.getLatLng(), states, true);
// document.getElementById('state').innerHTML = 'cos tam2' ?
// layer[0].feature.properties.name : 'cos tam';
var layer = leafletPip.pointInLayer(this.getLatLng(), states, true);
states.setStyle({fillColor: 'black'});
if(layer == false) {
states.setStyle({fillColor: '#ff7800'});
}
});
poniżej link do skryptu:
http://jsfiddle.net/k4fzn/1/
Ten post edytował mazyl 7.05.2014, 08:49:19
[JavaScript]mapa mapbox zmiana koloru geojson
