1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>API Geoportail - votre carte personnelle</title>
<meta http-equiv="X-UA-Compatible" content="IE=7"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<script
type="text/javascript"
src="http://api.ign.fr/geoportail/api?v=1.0beta4&key=8933678217670066389&instance=VISU">
<!-- -->
</script>
<script type="text/javascript">
<!--
function initGeoportalMap() {
geoportalLoadVISU("GeoportalVisuDiv", "normal");
// Exemple avec un code territoire (ici la Guadeloupe)
// Snapshot with a territory code (here Guadeloupe island)
// geoportalLoadVISU("GeoportalVisuDiv", "normal", "GLP");
if (VISU) {
VISU.addGeoportalLayers();
// Creation d’un point
var mon_point = new OpenLayers.Geometry.Point(-0.4, 46.65);
// Passage en projection Géoportail
var sourceproj = OpenLayers.Projection.CRS84; // WGS84
var destproj = VISU.projection; // projection Geoportail
mon_point.transform(sourceproj, destproj);
// Création du POI à partir du point
var stylepoi = {externalGraphic:'http://api.ign.fr/geoportail/api/js/1.0beta4/theme/geoportal/img/picto_zoomToMapExtent_ off.gif', graphicWidth:50, graphicHeight:50 };
var mon_poi = new OpenLayers.Feature.Vector(mon_point, null, stylepoi);
// Ajout d’une couche d'objet vectoriels
var vector_layer = new OpenLayers.Layer.Vector('Mes POIs');
// Ajout du POI à la couche créée et affichage de la couche
vector_layer.addFeatures([mon_poi]);
// Ajout de la couche à la carte
VISU.getMap().addLayer(vector_layer);
// Ajout de l’info bulle
var popup = new OpenLayers.Popup('id',
new OpenLayers.LonLat(mon_point.x, mon_point.y),
new OpenLayers.Size(200,50),
'Ma Première info bulle',
true
);
// Ajout de l’info bulle
VISU.getMap().addPopup(popup, true);
}
}
-->
</script>
</head>
<body>
<div id="GeoportalVisuDiv" style="width:800px;height:600px;"></div>
</body>
</html> |
Partager