[SPIP Zone] Couleur d'un tracé KML dans GIS

jeanmarie · Juin 6, 2019, 3:15

Salut,

je cherche à changer la couleur du tracé d'un KML affiché sur une carte mais je trouve pas comment faire.

La couleur qui s'affiche est #3388ff et semble venir de https://zone.spip.net/trac/spip-zone/browser/spip-zone/plugins/gis/trunk/lib/leaflet/dist/leaflet.js

J'ai tenté de passer path_styles=#ARRAY{color,#fff} au modèle GIS, mais ça n'a pas l'air d'agir sur le KML.

                     jean marie

JLuc · Juin 6, 2019, 4:51

Le 06/06/2019 à 17:15, Jean Marie Grall a écrit :

je cherche à changer la couleur du tracé d'un KML affiché sur une carte mais je trouve pas comment faire.
La couleur qui s'affiche est #3388ff et semble venir de https://zone.spip.net/trac/spip-zone/browser/spip-zone/_plugins_/gis/trunk/lib/leaflet/dist/leaflet.js
J'ai tenté de passer path_styles=#ARRAY{color,#fff} au modèle GIS, mais ça n'a pas l'air d'agir sur le KML.

Je me sers pas de KML. Mais avec les cartes, il m'est arrivé de changer les valeurs
utilisées par défaut, en altérant l'objet produit par un js inséré dans la page.
Pour ça, avec l'aide des questions réponses trouvées sur le net et de la console javascript pour vérifier,
il faut accéder à l'objet javascript produit, repérer le chemin complet de cette propriété par rapport à l'objet,
et changer cette valeur en javascript ensuite.

JLuc

JLuc · Juin 6, 2019, 5:49

Le 06/06/2019 à 18:51, JLuc a écrit :

Le 06/06/2019 à 17:15, Jean Marie Grall a écrit :

je cherche à changer la couleur du tracé d'un KML affiché sur une carte mais je trouve pas comment faire.
La couleur qui s'affiche est #3388ff et semble venir de https://zone.spip.net/trac/spip-zone/browser/spip-zone/_plugins_/gis/trunk/lib/leaflet/dist/leaflet.js
J'ai tenté de passer path_styles=#ARRAY{color,#fff} au modèle GIS, mais ça n'a pas l'air d'agir sur le KML.

Je me sers pas de KML. Mais avec les cartes, il m'est arrivé de changer les valeurs
utilisées par défaut, en altérant l'objet produit par un js inséré dans la page.
Pour ça, avec l'aide des questions réponses trouvées sur le net et de la console javascript pour vérifier,
il faut accéder à l'objet javascript produit, repérer le chemin complet de cette propriété par rapport à l'objet,
et changer cette valeur en javascript ensuite.

Mais là c'est peut être pas très simple vu la réponse de b_b
https://github.com/shramov/leaflet-plugins/issues/109

Alors autrement tu peux essayer de surcharger la librairie js localement et changer la valeur en dur dans le code,
ou de l'inclure de telle manière que tu puisses passer un filtre dessus pour changer la valeur qui va pas.

JL

jeanmarie · Juin 7, 2019, 7:02

Salut,

Le 06/06/2019 à 19:49, JLuc a écrit :

Le 06/06/2019 à 18:51, JLuc a écrit :

Le 06/06/2019 à 17:15, Jean Marie Grall a écrit :

je cherche à changer la couleur du tracé d'un KML affiché sur une carte mais je trouve pas comment faire.
La couleur qui s'affiche est #3388ff et semble venir de https://zone.spip.net/trac/spip-zone/browser/spip-zone/_plugins_/gis/trunk/lib/leaflet/dist/leaflet.js
J'ai tenté de passer path_styles=#ARRAY{color,#fff} au modèle GIS, mais ça n'a pas l'air d'agir sur le KML.

Mais là c'est peut être pas très simple vu la réponse de b_b
https://github.com/shramov/leaflet-plugins/issues/109

Alors autrement tu peux essayer de surcharger la librairie js localement et changer la valeur en dur dans le code,
ou de l'inclure de telle manière que tu puisses passer un filtre dessus pour changer la valeur qui va pas.

Merci pour le lien, b_b donne la réponse : "the script use the style referenced in the KML"

La syntaxe à mettre dans le <LineString> du KML :
<Style>
<LineStyle>
<color>7f0000ff</color>
</LineStyle>
</Style>

Bonne soirée,

                 jean marie

b_b · Juin 11, 2019, 8:17

Hop,

Le 07/06/2019 à 21:02, Jean Marie Grall a écrit :

Merci pour le lien, b_b donne la réponse : "the script use the style referenced in the KML"

La syntaxe à mettre dans le <LineString> du KML :
<Style>
<LineStyle>
<color>7f0000ff</color>
</LineStyle>
</Style>

Oui voilà, on gère quelques éléments de style des KMLs dans le script, pas tous mais pas mal déjà, cf :

github.com

shramov/leaflet-plugins/blob/master/layer/vector/KML.js#L123


      
          		for (var i=0, len=sl.length; i<len; i++) {
          			var style = this.parseStyle(sl[i]);
          			if (style) {
          				var styleName = '#' + style.id;
          				styles[styleName] = style;
          			}
          		}
          		return styles;
          	},
          
          	parseStyle: function (xml) {
          		var style = {}, poptions = {}, ioptions = {}, el, id;
          
          		var attributes = {color: true, width: true, Icon: true, href: true, hotSpot: true};
          
          		function _parse (xml) {
          			var options = {};
          			for (var i = 0; i < xml.childNodes.length; i++) {
          				var e = xml.childNodes[i];
          				var key = e.tagName;
          				if (!attributes[key]) { continue; }

Et l'exemple associé :

github.com

shramov/leaflet-plugins/blob/master/examples/kml.html

<html>
<head>
	<title>Leaflet</title>
	<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" />
	<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
	<script src="../layer/vector/KML.js"></script>
</head>
<body>

<div style="width:100%; height:100%" id="map"></div>

<script type='text/javascript'>
	var map = L.map('map', {center: L.latLng(58.4, 43.0), zoom: 11});
	L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
	var track = new L.KML('KML_Samples.kml', {async: true})
		.on('loaded', function (e) {
			map.fitBounds(e.target.getBounds());
		})
		.addTo(map);
	L.control.layers({}, {'Track': track}, {collapsed: false}).addTo(map);

Ce fichier a été tronqué. afficher l'original

Sinon, autre plan, tu peux utiliser GIS Geometries qui permet d'importer des KMLs dans la base, et ensuite de définir le style des tracés, cf :

Et si tu veux vraiment faire des trucs poussés, tu peux toujours passer par les points d'entrées de l'API JS de GIS Astuces GIS et agir sur les items de du KML qui est un objet de type "FeatureGroup" dans Leaflet : https://leafletjs.com/reference-1.5.0.html#featuregroup-setstyle

++
b_b

jeanmarie · Juin 11, 2019, 9:15

hello,

Le 11/06/2019 à 10:17, Bruno Bergot a écrit :

Oui voilà, on gère quelques éléments de style des KMLs dans le script, pas tous mais pas mal déjà, cf :
leaflet-plugins/layer/vector/KML.js at master · shramov/leaflet-plugins · GitHub

Et l'exemple associé :
leaflet-plugins/examples/kml.html at master · shramov/leaflet-plugins · GitHub

Sinon, autre plan, tu peux utiliser GIS Geometries qui permet d'importer des KMLs dans la base, et ensuite de définir le style des tracés, cf :
GIS Geometries - SPIP-Contrib

j'ai regardé rapidement GIS Geometries, ça ne colle pas forcément à ce que j'ai mis en place mais ça pourrait me servir dans l'avenir.

Merci,

                 jean marie