viewer = {
// remove previous element
document.getElementById('cesiumContainer').replaceChildren();
// Initialize the Cesium Viewer in the HTML element with the `cesiumContainer` ID.
const viewer = new Cesium.Viewer('cesiumContainer', {
imageryProvider: Cesium.createWorldImageryAsync(),
// terrainProvider: Cesium.createWorldTerrainAsync(),
timeline: false,
animation: false,
sceneModePicker: false,
baseLayerPicker: false
});
// const longitude = 4.900314;
// const latitude = 52.379521;
// const height = 10;
// viewer.camera.flyTo({
// destination: Cesium.Ellipsoid.WGS84.cartographicToCartesian(new Cesium.Cartographic(longitude, latitude, height))
// })
const providerBase = new Cesium.UrlTemplateImageryProvider({
url : 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}',
});
const layerBase = new Cesium.ImageryLayer(providerBase);
viewer.imageryLayers.add(layerBase);
// Add Earth Engine layer on top
const provider = new Cesium.UrlTemplateImageryProvider({
url : imageAerial.getMap().urlFormat,
// maximumLevel: 200,
});
const layer = new Cesium.ImageryLayer(provider);
viewer.imageryLayers.add(layer);
return viewer
}
imageAerial = {
var image = ee.Image("PREP/vamshij/netherlands_2021")
return image.visualize({ min: 50, max: 230 })
}
imageWater = {
var waterOccurrence = ee.Image("JRC/GSW1_3/GlobalSurfaceWater").select('occurrence')
.divide(100).unmask(0).resample('bilinear')
//.convolve(ee.Kernel.gaussian(45, 30, 'meters'))
//.reduceNeighborhood(ee.Reducer.mean(), ee.Kernel.circle(45, 'meters'))
.rename('occurrence')
waterOccurrence = waterOccurrence.updateMask(waterOccurrence.unitScale(0, 0.02))
var waterOccurrenceMin = 0.02
var palette = ["2171b5", "4292c6", "6baed6", "9ecae1", "c6dbef", "deebf7", "f7fbff"]
var rgb = ee.Image(1).subtract(waterOccurrence)
.mask(waterOccurrence.unitScale(waterOccurrenceMin, waterOccurrenceMin + 0.2))
.visualize({ palette: palette, min: 0, max: 1 })
var land = ee.Image("users/gena/land_polygons_image").mask()
return rgb.updateMask(rgb.mask().multiply(land))
}
Cesium = import("https://esm.run/cesium@1.107");
import {ee} from '@gena/ee'
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.
