Skip to content

Instantly share code, notes, and snippets.

@emackey

emackey/PointPrimitiveTest.html

Created April 13, 2015 17:14
Show Gist options
  • Save emackey/7a4096d8535c835372f8 to your computer and use it in GitHub Desktop.
Save emackey/7a4096d8535c835372f8 to your computer and use it in GitHub Desktop.
Download ZIP
This is a test of the new PointPrimitiveCollection in Cesium.
Raw
PointPrimitiveTest.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> <!-- Use Chrome Frame in IE -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta name="description" content="Use Viewer to start building new applications or easily embed Cesium into existing applications.">
<meta name="cesium-sandcastle-labels" content="Beginner, Showcases">
<title>Cesium Demo</title>
<script type="text/javascript" src="../Sandcastle-header.js"></script>
<script type="text/javascript" src="../../../ThirdParty/requirejs-2.1.9/require.js"></script>
<script type="text/javascript">
require.config({
baseUrl : '../../../Source',
waitSeconds : 60
});
</script>
</head>
<body class="sandcastle-loading" data-sandcastle-bucket="bucket-requirejs.html">
<style>
@import url(../templates/bucket.css);
</style>
<div id="cesiumContainer" class="fullSize"></div>
<div id="loadingOverlay"><h1>Loading...</h1></div>
<div id="toolbar"></div>
<script id="cesium_sandcastle_script">
function startup(Cesium) {
"use strict";
//Sandcastle_Begin
//////////////////////////////
var USE_BILLBOARDS = false;
var numPoints = 100000;
//////////////////////////////
var viewer = new Cesium.Viewer('cesiumContainer', {
timeline : false,
animation : false
});
viewer.clock.shouldAnimate = false;
viewer.scene.debugShowFramesPerSecond = true;
var scene = viewer.scene;
var mouse = new Cesium.Cartesian2(-1, -1);
var lastMouse = new Cesium.Cartesian2(-1, -1);
var collection;
var imageSubRegion;
if (USE_BILLBOARDS) {
collection = scene.primitives.add(new Cesium.BillboardCollection());
imageSubRegion = new Cesium.BoundingRectangle(82, 10, 8, 8);
} else {
collection = scene.primitives.add(new Cesium.PointPrimitiveCollection());
}
var base = scene.globe.ellipsoid.radii.x;
var color = Cesium.Color.LIGHTSKYBLUE;
var outlineColor = Cesium.Color.BLACK;
for (var j = 0; j < numPoints; ++j) {
var position = new Cesium.Cartesian3(
16000000 * Math.random() - 8000000,
-(4000000 * j / numPoints + base),
2000000 * Math.random() - 1000000);
if (USE_BILLBOARDS) {
// Billboards
collection.add({
image : '../images/whiteShapes.png',
imageSubRegion : imageSubRegion,
color : color,
position : position
});
} else {
// PointPrimitives
collection.add({
pixelSize : 5,
color : color,
outlineColor : outlineColor,
outlineWidth : 0,
position : position
});
}
}
var camera = scene.camera;
camera.lookAtTransform(camera.transform, new Cesium.Cartesian3(0, -4.5 * base, base));
viewer.cesiumWidget.canvas.addEventListener('mousemove', function(e) {
mouse.x = e.clientX;
mouse.y = e.clientY;
}, false);
scene.postRender.addEventListener(function() {
if (!Cesium.Cartesian2.equals(mouse, lastMouse)) {
Cesium.Cartesian2.clone(mouse, lastMouse);
var pickedObject = scene.pick(mouse);
if (Cesium.defined(pickedObject) &&
Cesium.defined(pickedObject.primitive)) {
pickedObject.primitive.color = Cesium.Color.YELLOW.clone();
}
}
});
window.Cesium = Cesium;
window.viewer = viewer;
window.collection = collection;
//Sandcastle_End
Sandcastle.finishedLoading();
}
if (typeof Cesium !== "undefined") {
startup(Cesium);
} else if (typeof require === "function") {
require(["Cesium"], startup);
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment