Wie kann ich eine Bildüberlagerung hinzufügen, abhängig von den Optionen in den Polygoneigenschaften in einer Broschüre?

Question

Ich habe eine Multi-Polygon-Geojson-Datei (mapInfo), die eine der Eigenschaften namens "field_hazards" hat. Zu den Gefahren gehören "Sturm/Sturm, Starkregen, Gewitter und gefrierender Regen" Wie kann ich eine Bildüberlagerung abhängig von den field_hazard Optionen hinzufügen?

Beachten Sie, dass die Geojson-Datei dynamisch als Drupal-Feed abgerufen wird. Ich habe den folgenden Code erstellt, aber es gibt eine leere Map zurück, die Polygone werden nicht gerendert.

function getImage(d) { 
return d === 'Freezing Rain' ? "http://mymap:8082/images/weather-images/43n.png" : 
     d === 'Thunderstorm' ? "http://mymap:8082/images/weather-images/11.png" : 
     d === 'Heavy Rain' ? "http://my:8082/weather-images/02n.png" : 
     d === 'Gale\/Storm' ? "http://mymap:8082/images/weather-images/15.png" : 
         "http://my:8082/images/weather-images/09.png"; 

} 
var imageUrl = getImage(feature.properties.field_hazards); 
var imageLayer = L.imageOverlay(imageUrl, imageBounds).addTo(map).bringToBack(); 
var boxOptions = {fillOpacity:0, opacity:0, onEachFeature: onEachBox}; 
//create the image interaction box 
var imageBox = L.geoJson(mapInfo, boxOptions).addTo(map); 
//zoom in to fit GeoJSON layer 
map.fitBounds(imageBox.getBounds()); 

Ich habe in diesem Beispiel sah „add image to rect polygon in leaflet “, aber es erfordert mir die Bild-URL Voreinstellung als Eigenschaft haben ihre Selbst.

Answer 1

Ich habe eine Lösung von diesem Link. Posted für den Fall, dass jemand anderes interessiert ist.

Adding image overly in leaflet map from a property