#1 Sat 01 December 2012 13:46
- kitesurfzone
- Juste Inscrit !
- Date d'inscription: 1 Dec 2012
- Messages: 3
Open layer image overlayer ou via KML ?
Salut à tous,
j'ai épluché les posts du forum y compris ceux disponibles en anglais et ai du probablement tester l'ensemble des codes proposés.
Je souhaite intégrer un overlayer image.
Le soucis comme la majorité des gens :
Il s'affiche en base layer mais plus en overlayer. J'ai bien ma case avec le nom de mon layer d'affichée, mais l'image reste invisible.
Autrement j'ai réussi à intégrer un fichier KML correctement lu.
Est-ce qu'il est possible d'afficher des images via un fichier KML ?
J'ai plusieurs pistes de réflexion en cours :
1°) mon code est faux
2°) je me suis planté dans les coordonnées ?
3°) Je n'ai pas spécifié un système géodésique dans mon layer de base, et mon overlayer ne sait pas où s'afficher ?
4°) je sèche...
Voici mes codes :
Ici le base layer fonctionne :
Code:
<html> <head> <title>STX</title> <script src="OpenLayers.js"></script> <script defer="defer" type="text/javascript"> function init() { var map = new OpenLayers.Map('map'); var options = {numZoomLevels: 5}; var graphic = new OpenLayers.Layer.Image('City Lights', 's5_brut.png', new OpenLayers.Bounds(-180, -88.759, 180, 88.759), new OpenLayers.Size(580, 288), options, {layers: 'basic'}, { singleTile: true, ratio: 1 } ); map.addLayer(graphic); map.setCenter(new OpenLayers.LonLat(0, 0), 2); map.addControl(new OpenLayers.Control.LayerSwitcher()); map.zoomToMaxExtent(); } </script> </head> <body onload="init()"> <div id="map"></div> </body> </html>
Ici ça ne fonctionne plus :
Code:
<link rel="stylesheet" href="http://www.openlayers.org/api/theme/default/style.css" type="text/css" /> <style type="text/css"> #map { width: 800px; height: 600px; border: 1px solid black; } </style> <script src="OpenLayers.js"></script> <script src="http://openstreetmap.org/openlayers/OpenStreetMap.js"></script> <script type="text/javascript"> var map, select; function init(){ map = new OpenLayers.Map( 'map' ); layerMapnik = new OpenLayers.Layer.OSM.Mapnik("Carte de base Open street maps"); map.addLayer(layerMapnik); navmap = new OpenLayers.Layer.Image( 'Nav', 's5_brut.png', new OpenLayers.Bounds(47.8621727,-4.1346245,47.8603736,-4.1388403), new OpenLayers.Size(8563, 12740), {'maxResolution': 'auto', 'isBaseLayer': false } ); map.addLayer(navmap); var sundials = new OpenLayers.Layer.Vector("Données végétales", { projection: map.displayProjection, strategies: [new OpenLayers.Strategy.Fixed()], protocol: new OpenLayers.Protocol.HTTP({ url: "seuil_essai.kml", format: new OpenLayers.Format.KML({ extractStyles: true, extractAttributes: true }) }) }); map.addLayer(sundials); select = new OpenLayers.Control.SelectFeature(sundials); sundials.events.on({ "featureselected": onFeatureSelect, "featureunselected": onFeatureUnselect }); map.addControl(select); select.activate(); OpenLayers.ImgPath = "http://js.mapbox.com/theme/dark/"; map.addControl(new OpenLayers.Control.OverviewMap()); map.addControl(new OpenLayers.Control.PanZoomBar()); map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false})); map.addControl(new OpenLayers.Control.KeyboardDefaults()); map.setCenter(new OpenLayers.LonLat(-4.138, 47.860).transform(new OpenLayers.Projection("EPSG:4326"), new OpenLayers.Projection("EPSG:900913")), 14); } function onPopupClose(evt) { select.unselectAll(); } function onFeatureSelect(event) { var feature = event.feature; // Since KML is user-generated, do naive protection against // Javascript. var content = "<h2>"+feature.attributes.name + "</h2>" + feature.attributes.description; if (content.search("<script") != -1) { content = "Content contained Javascript! Escaped content below.<br>" + content.replace(/</g, "<"); } popup = new OpenLayers.Popup.FramedCloud("chicken", feature.geometry.getBounds().getCenterLonLat(), new OpenLayers.Size(100,100), content, null, true, onPopupClose); feature.popup = popup; map.addPopup(popup); } function onFeatureUnselect(event) { var feature = event.feature; if (feature.popup) { map.removePopup(feature.popup); feature.popup.destroy(); delete feature.popup; } } </script> <body onLoad="init()"> <div id="map"></div> </body>
Hors ligne
#2 Sun 02 December 2012 20:40
- michel56
- Participant assidu
- Lieu: Lorient
- Date d'inscription: 14 Jul 2012
- Messages: 474
Re: Open layer image overlayer ou via KML ?
Bonsoir,
Une discussion a déjà eu lieu à cette adresse:
http://georezo.net/forum/viewtopic.php?id=58150
Ça va peut-être t'aider.
Opérateur cartographique & DAO & PHP.
Hors ligne
#3 Sun 02 December 2012 22:37
- kitesurfzone
- Juste Inscrit !
- Date d'inscription: 1 Dec 2012
- Messages: 3
Re: Open layer image overlayer ou via KML ?
Merci pour ta réponse j'avais déjà regardé, le code ne marche pas et je commence vraiment à pense que c'est un problème de système géodésique utilisé, j'ai du me planter quelque part.
Mon code a depuis évolué, mais je n'ai pas encore touché au layer image étant donné que je n'arrive pas à l'afficher.
J'écarte le KML, l'image n'est pas affichée. Cependant il apporte des avantages, notamment pour l'affichage des popups.
Je post ici le début de mon code travaillé :
Code:
function init(){ map = new OpenLayers.Map( 'map' ); layerMapnik = new OpenLayers.Layer.OSM.Mapnik("Carte de base Open street maps"); map.addLayer(layerMapnik); //configuration des outils de carte OpenLayers.ImgPath = "img/"; map.addControl(new OpenLayers.Control.OverviewMap()); map.addControl(new OpenLayers.Control.PanZoomBar()); map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false}, {'roundedCorner':true})); map.addControl(new OpenLayers.Control.KeyboardDefaults()); map.addControl(new OpenLayers.Control.MousePosition()); map.setCenter(new OpenLayers.LonLat(-4.138, 47.860).transform(new OpenLayers.Projection("EPSG:4326"), new OpenLayers.Projection("EPSG:900913")), 14); //fin section configurations //début des layers //layers de test images : navmap = new OpenLayers.Layer.Image( 'Nav', 's5_brut.png', new OpenLayers.Bounds(-4.1546, 47.8446, -4.1281, 47.8607), new OpenLayers.Size(8563, 12740), {'maxResolution': 'auto', 'isBaseLayer': false } ); map.addLayer(navmap); //fin test1 var bounds = new OpenLayers.Bounds(-4.1546, 47.8446, -4.1281, 47.8607); bounds.transform(new OpenLayers.Projection("EPSG:900913"), map.getProjectionObject()); transports =new OpenLayers.Layer.Image("Desserte actuelle et future", "s5_brut.png", bounds, new OpenLayers.Size(580, 500), {isBaseLayer:false}); map.addLayer(transports); //fin test2 //fin essai image //Chargement du KML données végétales pré travaux
Hors ligne
#4 Mon 03 December 2012 19:40
- michel56
- Participant assidu
- Lieu: Lorient
- Date d'inscription: 14 Jul 2012
- Messages: 474
Re: Open layer image overlayer ou via KML ?
tu es sur de l'emplacement de ton image
Opérateur cartographique & DAO & PHP.
Hors ligne
#5 Tue 04 December 2012 14:09
- kitesurfzone
- Juste Inscrit !
- Date d'inscription: 1 Dec 2012
- Messages: 3
Re: Open layer image overlayer ou via KML ?
Salut,
Oui mon image est pour l'instant à la racine de mon dossier de travail, ce qui me permet de coder rapidement.
Après dès que ça marchera je changerai l'emplacement de mon image.
Depuis j'ai rajouté le système géodésique, et la taille maximale du baselayer. Je ne comprends plus ce qui ne va pas j'ai épuré les forums et ai essayé tout ce qu'ils proposent.
Je vais continuer et tout reprendre dans l'espoir.
Ceci dit si quelqu'un veut bien m'aider je suis preneur.
Ben
Hors ligne