Cesiumjs 1.5 - with toGoJson
A clean demo of Cesiumjs 1.5
HTML
<script src="http://cesiumjs.org/Cesium/Build/CesiumUnminified/Cesium.js"></script>
<div id=cesiumContainer></div>
CSS
html, body {
margin: 0;
padding: 0;
height: 100%;
}
#cesiumContainer, .cesium-viewer,
.cesium-viewer-cesiumWidgetContainer, .cesium-widget,
.cesium-widget canvas {
width: 100%;
height: 100%;
}
.cesium-widget {
position: relative;
}
.cesium-widget,.cesium-widget canvas {
width: 100%;
height: 100%;
touch-action: none;
}
.cesium-widget-credits {
display: block;
position: absolute;
bottom: 0;
left: 0;
color: #fff;
font-size: 10px;
text-shadow: 0px 0px 2px #000000;
padding-right: 5px;
}
.cesium-widget-credits a,
.cesium-widget-credits a:visited {
color: #fff;
}
.cesium-widget-errorPanel {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
text-align: center;
background: rgba(0, 0, 0, 0.7);
z-index: 99999;
}
.cesium-widget-errorPanel:before {
display: inline-block;
vertical-align: middle;
height: 100%;
content: "";
}
.cesium-widget-errorPanel-content {
width: 75%;
display: inline-block;
text-align: left;
vertical-align: middle;
border: 1px solid #526F82;
border-radius: 7px;
background-color: black;
color: white;
font-size: 10pt;
padding: 1em;
}
.cesium-widget-errorPanel-header {
font-size: 120%;
color: #fe4;
}
.cesium-widget-errorPanel-scroll {
overflow: auto;
font-family: monospace;
white-space: pre-wrap;
padding: 0;
margin: 10px 0;
}
.cesium-widget-errorPanel-buttonPanel {
text-align: center;
}
.cesium-viewer {
font-family: sans-serif;
font-size: 16px;
overflow: hidden;
display: block;
position: relative;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.cesium-viewer-cesiumWidgetContainer {
width: 100%;
height: 100%;
}
.cesium-viewer-bottom {
display: block;
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding-right: 5px;
}
.cesium-viewer .cesium-widget-credits {
display: inline;
...
JavaScript
var viewer = new Cesium.Viewer('cesiumContainer');
var greenPolygon = viewer.entities.add({
name : 'Green extruded polygon',
polygon : {
hierarchy : Cesium.Cartesian3.fromDegreesArray([-108.0, 42.0,
-100.0, 42.0,
-104.0, 40.0]),
extrudedHeight: 500000.0,
material : Cesium.Color.GREEN
}
});
var bluePolygon = viewer.entities.add({
name : 'Blue polygon with holes and outline',
polygon : {
hierarchy : {
positions : Cesium.Cartesian3.fromDegreesArray([-99.0, 30.0,
-85.0, 30.0,
-85.0, 40.0,
-99.0, 40.0]),
holes : [{
positions : Cesium.Cartesian3.fromDegreesArray([
-97.0, 31.0,
-97.0, 39.0,
-87.0, 39.0,
-87.0, 31.0
]),
holes : [{
positions : Cesium.Cartesian3.fromDegreesArray([
-95.0, 33.0,
-89.0, 33.0,
-89.0, 37.0,
-95.0, 37.0
]),
holes : [{
positions : Cesium.Cartesian3.fromDegreesArray([
-93.0, 34.0,
-91.0, 34.0,
-91.0, 36.0,
-93.0, 36.0
])
}]
}]
}]
},
material : Cesium.Color.BLUE,
outline : true,
outlineColor : Cesium.Color.BLACK
}
});
setInterval(function(){
viewer.entities.add({
name : 'AADA',
position : Cesium.Cartesian3.fromDegrees(-65.59777, 35.03883),
...