Public
Edited
Dec 6
Insert cell
Insert cell
// Création de la carte Google Maps JS dans un <div> dimensionné et créé à l'avance
{
let lediv = html`<div style='height:500px;'></div>`;
yield lediv; //Mot-clé Observable qui déclanche la création du <div>
//Source WMS de points servie en KML
let kmlsrc = "https://www.geotests.net/geoserver/ljegou/wms/reflect?layers=ljegou:test_points&format=kml";
let map = new google.maps.Map(lediv, {
center: Sigma_UT2J,
zoom: 10,
//mapTypeId: 'roadmap',
scaleControl: true
});
var kmlLayer = new google.maps.KmlLayer(kmlsrc, {
//suppressInfoWindows: true,
preserveViewport: false,
map: map
});
kmlLayer.addListener('click', function(event) {
var content = event.featureData.infoWindowHtml;
// debugger;
var testimonial = document.getElementById('capture');
testimonial.innerHTML = content;
});
mapHolder[0]=map;
}
Insert cell
//Div pour afficher les popups.
popuppdiv = html`<div id='capture'></div>`;
Insert cell
Sigma_UT2J = new google.maps.LatLng(43.5782,1.4012);
Insert cell
// Variable pour stocker la carte en portée globale sur la page
mapHolder = [0];
Insert cell
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more