Suite

OpenLayers : png comme marqueur graphique externe

OpenLayers : png comme marqueur graphique externe


Je voudrais styliser mes caractéristiques ponctuelles. Pour certains marqueurs, j'utilise les options pratiques OpenLayers.StyleMap, pour certains d'entre eux, j'aimerais utiliser un graphique png externe (le cercle de camouflage). J'utilise un système linux et le navigateur firefox. Le code fonctionne assez si je laisse de côté le graphique externe. Si j'ajoute le graphique, la fonctionnalité disparaît. Y a-t-il quelque chose de spécifique que je dois considérer? Toute aide est la bienvenue.

Ce graphique a une taille de 14,2 Ko et a été édité avec l'éditeur de graphiques vectoriels. Mon code pour l'instant est :

var styleMap = new OpenLayers.StyleMap({ "default": new OpenLayers.Style({ graphicName: "cross", pointRadius: "5", // dimensionné selon l'attribut de type fillColor: '#FF8000', fillOpacity: "50 " , //o.8 original strokeOpacity: "60", //1 original strokeWidth: "1", }, { // applique une règle afin d'afficher un nom à côté du point de station dans les règles de légende : [ new OpenLayers. Rule({ name: "Stations", // c'est ce qui est affiché sur le panneau de légende elseFilter: true, symbolizer: { graphicName: "cross", pointRadius: "5", fillColor: "#FF8000", strokeOpacity: "60" , strokeWidth : "1", } }), new OpenLayers.Rule({ nom : "Climate, Soil & Water Quality", filter : new OpenLayers.Filter.Comparison({ type : OpenLayers.Filter.Comparison.LIKE, property : "nom", valeur : "Zarnekow", }), symboliseur : { externalGraphic : "… /img/point_camouflage1.png">

avez-vous essayé de déplacer le graphique dans le même dossier ou un sous-dossier ?

ou utilisez une adresse absolue http://jsfiddle.net/ucrtthya/

et n'oubliez pas de charger le site Web avec le protocole http, comme http://localhost/mymap.html sinon cela pourrait peut-être poser problème si vous ouvrez la page Web avec "file///" et essayez de charger une image avec le protocole "http://"


dans votre Javascript, il manque deux crochets à la fin. c'est peut-être ça le problème. voir http://jsfiddle.net/po6m5aok/2/


Voir la vidéo: TUTO CARTE DE FLUX ou FLOW MAP SOUS QGIS