I want to help more people experience the excitement of exploring Earth's subsurface
globeletjs = import("globeletjs")
document.head.appendChild(
html`<link href="https://unpkg.com/globeletjs@0.1.1/dist/globelet.css" rel=stylesheet>`
)
maptilerKey = "mrAq6zQEFxOkanukNbGm" // Get your own key: maptiler.com
style = {
let doc = await FileAttachment("klokantech-basic-style.json").json();
Object.values(doc.sources).forEach(src => {
if (src.url) src.url = src.url.replace(/{key}/, maptilerKey);
});
doc.glyphs = doc.glyphs.replace(/{key}/, maptilerKey);
return doc;
}
globe = globeletjs.initGlobe({
container,
style,
center: [-70, 30], // Initial [longitude, latitude] of camera
altitude: 6371 * 3 // Initial camera altitude: approximately 3x Earth radius
})
globe.startAnimation()
html`<style>
#globeDiv {
height: 600px;
width: ${width}px;
}
.globelet .main {
background-color: grey;
}
`
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.
