emackey · May 31, 2015 23:18
diff --git a/BoundingSphereUnions.html b/BoundingSphereUnions.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="Draw some circles.">
    <meta name="cesium-sandcastle-labels" content="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
 //
 // NOTE: This is not a perfect rendering.  Don't zoom out to the point where
 //       the Earth's curvature starts to interfere with Circle placement, or
 //       the vis won't match what the spheres are really doing.
 //
 var extent = Cesium.Rectangle.fromDegrees(-0.001,-0.001,0.001,0.001);

 Cesium.Camera.DEFAULT_VIEW_RECTANGLE = extent;
 Cesium.Camera.DEFAULT_VIEW_FACTOR = 0;

 // Create the viewer.
 var viewer = new Cesium.Viewer('cesiumContainer');
 var scene = viewer.scene;
 var ellipsoidRadius = scene.globe.ellipsoid.maximumRadius;
 var alpha = 0.4;

 window.Cesium = Cesium;
 window.viewer = viewer;

 function draw(sphere, color) {
    // Create the circle geometry.
    var circleGeometry = new Cesium.CircleGeometry({
        center : sphere.center,
        radius : sphere.radius,
        vertexFormat : Cesium.PerInstanceColorAppearance.VERTEX_FORMAT
    });
    // Create a geometry instance using the circle geometry
    // created above. We can also specify a color attribute,
    // in this case, we're creating a translucent red color.
    var circleInstance = new Cesium.GeometryInstance({
        geometry : circleGeometry,
        attributes : {
            color : Cesium.ColorGeometryInstanceAttribute.fromColor(
                color.withAlpha(alpha, new Cesium.Color()))
        }
    });
    // Add the geometry instance to primitives.
    return scene.primitives.add(new Cesium.Primitive({
        geometryInstances: [circleInstance],
        appearance: new Cesium.PerInstanceColorAppearance({
            closed: true
        })
    }));
 }
       
 function place(x, y) {
    return new Cesium.Cartesian3(ellipsoidRadius, x, y);
 }

 var sphereRed = new Cesium.BoundingSphere(place(0, 0), 40);
 var sphereGreen = new Cesium.BoundingSphere(place(40, 0), 10);

 draw(sphereRed, Cesium.Color.RED);
 var greenPrimitive = draw(sphereGreen, Cesium.Color.LIME);

 var sphereUnion = Cesium.BoundingSphere.union(sphereRed, sphereGreen, new Cesium.BoundingSphere());
 var unionPrimitive = draw(sphereUnion, Cesium.Color.YELLOW);

 var lastMouse = new Cesium.Cartesian2();
 var container = viewer.container;
 container.addEventListener('mousedown', function(e) {
    var isMouseDown = e.button === 0;
    lastMouse.x = e.clientX;
    lastMouse.y = e.clientY;
    viewer.scene.screenSpaceCameraController.enableInputs = !isMouseDown;
    if (!isMouseDown) {
        return;
    }
    var cartesian = viewer.camera.pickEllipsoid(lastMouse, scene.globe.ellipsoid);
    if (Cesium.defined(cartesian)) {
        cartesian.x = ellipsoidRadius;
        sphereGreen.center = cartesian;
        scene.primitives.remove(greenPrimitive);
        scene.primitives.remove(unionPrimitive);
        greenPrimitive = draw(sphereGreen, Cesium.Color.LIME);

        sphereUnion = Cesium.BoundingSphere.union(sphereRed, sphereGreen, sphereUnion);
        unionPrimitive = draw(sphereUnion, Cesium.Color.YELLOW);
    }
 }, false);
 //Sandcastle_End
    Sandcastle.finishedLoading();
 }
 if (typeof Cesium !== "undefined") {
    startup(Cesium);
 } else if (typeof require === "function") {
    require(["Cesium"], startup);
 }
 </script>
 </body>
 </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="Draw some circles.">
	<meta name="cesium-sandcastle-labels" content="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
	//
	// NOTE: This is not a perfect rendering. Don't zoom out to the point where
	// the Earth's curvature starts to interfere with Circle placement, or
	// the vis won't match what the spheres are really doing.
	//
	var extent = Cesium.Rectangle.fromDegrees(-0.001,-0.001,0.001,0.001);

	Cesium.Camera.DEFAULT_VIEW_RECTANGLE = extent;
	Cesium.Camera.DEFAULT_VIEW_FACTOR = 0;

	// Create the viewer.
	var viewer = new Cesium.Viewer('cesiumContainer');
	var scene = viewer.scene;
	var ellipsoidRadius = scene.globe.ellipsoid.maximumRadius;
	var alpha = 0.4;

	window.Cesium = Cesium;
	window.viewer = viewer;

	function draw(sphere, color) {
	// Create the circle geometry.
	var circleGeometry = new Cesium.CircleGeometry({
	center : sphere.center,
	radius : sphere.radius,
	vertexFormat : Cesium.PerInstanceColorAppearance.VERTEX_FORMAT
	});
	// Create a geometry instance using the circle geometry
	// created above. We can also specify a color attribute,
	// in this case, we're creating a translucent red color.
	var circleInstance = new Cesium.GeometryInstance({
	geometry : circleGeometry,
	attributes : {
	color : Cesium.ColorGeometryInstanceAttribute.fromColor(
	color.withAlpha(alpha, new Cesium.Color()))
	}
	});
	// Add the geometry instance to primitives.
	return scene.primitives.add(new Cesium.Primitive({
	geometryInstances: [circleInstance],
	appearance: new Cesium.PerInstanceColorAppearance({
	closed: true
	})
	}));
	}

	function place(x, y) {
	return new Cesium.Cartesian3(ellipsoidRadius, x, y);
	}

	var sphereRed = new Cesium.BoundingSphere(place(0, 0), 40);
	var sphereGreen = new Cesium.BoundingSphere(place(40, 0), 10);

	draw(sphereRed, Cesium.Color.RED);
	var greenPrimitive = draw(sphereGreen, Cesium.Color.LIME);

	var sphereUnion = Cesium.BoundingSphere.union(sphereRed, sphereGreen, new Cesium.BoundingSphere());
	var unionPrimitive = draw(sphereUnion, Cesium.Color.YELLOW);

	var lastMouse = new Cesium.Cartesian2();
	var container = viewer.container;
	container.addEventListener('mousedown', function(e) {
	var isMouseDown = e.button === 0;
	lastMouse.x = e.clientX;
	lastMouse.y = e.clientY;
	viewer.scene.screenSpaceCameraController.enableInputs = !isMouseDown;
	if (!isMouseDown) {
	return;
	}
	var cartesian = viewer.camera.pickEllipsoid(lastMouse, scene.globe.ellipsoid);
	if (Cesium.defined(cartesian)) {
	cartesian.x = ellipsoidRadius;
	sphereGreen.center = cartesian;
	scene.primitives.remove(greenPrimitive);
	scene.primitives.remove(unionPrimitive);
	greenPrimitive = draw(sphereGreen, Cesium.Color.LIME);

	sphereUnion = Cesium.BoundingSphere.union(sphereRed, sphereGreen, sphereUnion);
	unionPrimitive = draw(sphereUnion, Cesium.Color.YELLOW);
	}
	}, false);
	//Sandcastle_End
	Sandcastle.finishedLoading();
	}
	if (typeof Cesium !== "undefined") {
	startup(Cesium);
	} else if (typeof require === "function") {
	require(["Cesium"], startup);
	}
	</script>
	</body>
	</html>