mirror of
https://github.com/NASAWorldWind/WebWorldWind.git
synced 2025-12-08 19:46:18 +00:00
268 lines
12 KiB
JavaScript
268 lines
12 KiB
JavaScript
/*
|
||
* Copyright 2003-2006, 2009, 2017, 2020 United States Government, as represented
|
||
* by the Administrator of the National Aeronautics and Space Administration.
|
||
* All rights reserved.
|
||
*
|
||
* The NASAWorldWind/WebWorldWind platform is licensed under the Apache License,
|
||
* Version 2.0 (the "License"); you may not use this file except in compliance
|
||
* with the License. You may obtain a copy of the License
|
||
* at http://www.apache.org/licenses/LICENSE-2.0
|
||
*
|
||
* Unless required by applicable law or agreed to in writing, software distributed
|
||
* under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR
|
||
* CONDITIONS OF ANY KIND, either express or implied. See the License for the
|
||
* specific language governing permissions and limitations under the License.
|
||
*
|
||
* NASAWorldWind/WebWorldWind also contains the following 3rd party Open Source
|
||
* software:
|
||
*
|
||
* ES6-Promise – under MIT License
|
||
* libtess.js – SGI Free Software License B
|
||
* Proj4 – under MIT License
|
||
* JSZip – under MIT License
|
||
*
|
||
* A complete listing of 3rd Party software notices and licenses included in
|
||
* WebWorldWind can be found in the WebWorldWind 3rd-party notices and licenses
|
||
* PDF found in code directory.
|
||
*/
|
||
/**
|
||
* Tests changing the state of SurfaceShape types with a timer.
|
||
*/
|
||
requirejs(['./WorldWindShim',
|
||
'./LayerManager'],
|
||
function (WorldWind,
|
||
LayerManager) {
|
||
"use strict";
|
||
|
||
// Tell WorldWind to log only warnings and errors.
|
||
WorldWind.Logger.setLoggingLevel(WorldWind.Logger.LEVEL_WARNING);
|
||
|
||
// Create the WorldWindow.
|
||
var wwd = new WorldWind.WorldWindow("canvasOne");
|
||
|
||
// Create and add layers to the WorldWindow.
|
||
var layers = [
|
||
// Imagery layers.
|
||
{layer: new WorldWind.BMNGOneImageLayer(), enabled: true},
|
||
{layer: new WorldWind.BMNGLayer(), enabled: true},
|
||
{layer: new WorldWind.ShowTessellationLayer(), enabled: true},
|
||
// Add atmosphere layer on top of all base layers.
|
||
{layer: new WorldWind.AtmosphereLayer(), enabled: true},
|
||
// WorldWindow UI layers.
|
||
{layer: new WorldWind.CompassLayer(), enabled: true},
|
||
{layer: new WorldWind.CoordinatesDisplayLayer(wwd), enabled: true},
|
||
{layer: new WorldWind.ViewControlsLayer(wwd), enabled: true},
|
||
{layer: new WorldWind.FrameStatisticsLayer(wwd), enabled: true}
|
||
];
|
||
|
||
for (var l = 0; l < layers.length; l++) {
|
||
layers[l].layer.enabled = layers[l].enabled;
|
||
wwd.addLayer(layers[l].layer);
|
||
}
|
||
|
||
// Create a layer to hold surface shapes
|
||
var shapesLayer = new WorldWind.RenderableLayer("Surface Shapes");
|
||
wwd.addLayer(shapesLayer);
|
||
|
||
// Create and set attributes that will be shared with all the shapes.
|
||
var attributes = new WorldWind.ShapeAttributes(null);
|
||
attributes.outlineWidth = 5;
|
||
attributes.outlineColor = WorldWind.Color.WHITE;
|
||
attributes.interiorColor = new WorldWind.Color(0, 1, 1, 0.5);
|
||
|
||
// Create highlight attributes that all the shapes will use (except polyline, see below).
|
||
var highlightAttributes = new WorldWind.ShapeAttributes(attributes);
|
||
highlightAttributes.interiorColor = new WorldWind.Color(1, 1, 1, 1);
|
||
|
||
// Create different types of SurfaceShapes and add them to the Surface Shapes layer
|
||
|
||
// Surface circle
|
||
var circle = new WorldWind.SurfaceCircle(new WorldWind.Location(35, -120), 200e3, attributes);
|
||
circle.highlightAttributes = highlightAttributes;
|
||
shapesLayer.addRenderable(circle);
|
||
|
||
// Surface ellipse
|
||
var ellipse = new WorldWind.SurfaceEllipse(new WorldWind.Location(35, -110), 300e3, 200e3, 45, attributes);
|
||
ellipse.highlightAttributes = highlightAttributes;
|
||
shapesLayer.addRenderable(ellipse);
|
||
|
||
// Surface rectangle
|
||
var rectangle = new WorldWind.SurfaceRectangle(new WorldWind.Location(35, -100), 200e3, 300e3, -45, attributes);
|
||
rectangle.highlightAttributes = highlightAttributes;
|
||
shapesLayer.addRenderable(rectangle);
|
||
|
||
// Surface Sector
|
||
var surfaceSector = new WorldWind.SurfaceSector(new WorldWind.Sector(33, 37, -95, -90), attributes);
|
||
// Append counter to cycle an array of sectors and set it to this SurfaceSector
|
||
surfaceSector.sectorCounter = 0;
|
||
|
||
surfaceSector.highlightAttributes = highlightAttributes;
|
||
shapesLayer.addRenderable(surfaceSector);
|
||
|
||
// Surface polygon
|
||
var polygonBoundary = [];
|
||
polygonBoundary.push(new WorldWind.Location(40, -105));
|
||
polygonBoundary.push(new WorldWind.Location(45, -110));
|
||
polygonBoundary.push(new WorldWind.Location(40, -115));
|
||
|
||
var polygon = new WorldWind.SurfacePolygon(polygonBoundary, attributes);
|
||
// Append properties to shift the polygon eastward and westward.
|
||
polygon.shiftCounter = 0;
|
||
polygon.shiftDirection = "west";
|
||
|
||
polygon.highlightAttributes = highlightAttributes;
|
||
shapesLayer.addRenderable(polygon);
|
||
|
||
// Surface polyline
|
||
var polylineBoundary = [];
|
||
polylineBoundary.push(new WorldWind.Location(40, -90));
|
||
polylineBoundary.push(new WorldWind.Location(45, -95));
|
||
polylineBoundary.push(new WorldWind.Location(40, -100));
|
||
|
||
var polyline = new WorldWind.SurfacePolyline(polylineBoundary, attributes);
|
||
// Append properties to shift the polyline eastward and westward.
|
||
polyline.shiftCounter = 0;
|
||
polyline.shiftDirection = "west";
|
||
|
||
// Since polyline doesn't have an interior, we will set different highlight attributes for it.
|
||
highlightAttributes = new WorldWind.ShapeAttributes(attributes);
|
||
highlightAttributes.outlineColor = new WorldWind.Color(0, 1, 1, 0.5);
|
||
|
||
polyline.highlightAttributes = highlightAttributes;
|
||
shapesLayer.addRenderable(polyline);
|
||
|
||
// Create another SurfacePolyline that crosses a big portion of the western hemisphere.
|
||
var bigPolylineBoundary = [];
|
||
bigPolylineBoundary.push(new WorldWind.Location(-45, -135));
|
||
bigPolylineBoundary.push(new WorldWind.Location(45, -32));
|
||
var bigPolyline = new WorldWind.SurfacePolyline(bigPolylineBoundary, attributes);
|
||
shapesLayer.addRenderable(bigPolyline);
|
||
|
||
// Create another bigger SurfaceRectangle that will have its number of edges changed
|
||
var bigRectangle = new WorldWind.SurfaceRectangle(new WorldWind.Location(0, 0), 200e4, 900e4, 45, attributes);
|
||
bigRectangle.highlightAttributes = highlightAttributes;
|
||
shapesLayer.addRenderable(bigRectangle);
|
||
|
||
// Create another surface ellipse near the pole to test its changing polar throttling
|
||
var polarEllipse = new WorldWind.SurfaceEllipse(new WorldWind.Location(90, -110), 1e5, 5e6, 90, attributes);
|
||
polarEllipse.highlightAttributes = highlightAttributes;
|
||
shapesLayer.addRenderable(polarEllipse);
|
||
|
||
// Create a highlight controller for highlighting.
|
||
var highlightController = new WorldWind.HighlightController(wwd);
|
||
|
||
// Update SurfaceShapes according to a timer
|
||
window.setInterval(function () {
|
||
// Rotate ellipse 10 degrees clockwise
|
||
ellipse.heading += 10;
|
||
|
||
// Rotate rectangle 30 degrees counterclockwise
|
||
rectangle.heading -= 30;
|
||
|
||
// Update circle radius size
|
||
circle.radius === 200e3 ? circle.radius += 100e3 : circle.radius = 200e3;
|
||
|
||
// Shift polygon and polyline eastward and westward
|
||
polygon.boundaries = shiftBoundaries(polygon);
|
||
polyline.boundaries = shiftBoundaries(polyline);
|
||
|
||
// Cycle through sectors in different locations
|
||
surfaceSector.sector = changeSector(surfaceSector);
|
||
|
||
// Flip number of edges for the bigger rectangle.
|
||
// A rougher, lower edge count ban be seen in the lowest setting.
|
||
// See: SurfaceShape.DEFAULT_NUM_EDGE_INTERVALS
|
||
bigRectangle.maximumNumEdgeIntervals = flipNumberOfEdgeIntervals(bigRectangle);
|
||
|
||
// Cycle through the three different path types for the larger polyline:
|
||
// Great circle, rhumb line (looks straight in Mercator), and linear (looks straight in equirectangular).
|
||
bigPolyline.pathType = cycleThroughPathTypes(bigPolyline);
|
||
|
||
// Switch back and forth the polar throttling boundary rendering for the ellipse in the North Pole.
|
||
// Straight edges can be seen in equirectangular projection, that look like 'bumps' in the SurfaceEllipse
|
||
// boundary near the pole when reprojected in the 3D globe.
|
||
polarEllipse.polarThrottle === 10 ? polarEllipse.polarThrottle = 0 : polarEllipse.polarThrottle = 10;
|
||
|
||
wwd.redraw();
|
||
}, 1000);
|
||
|
||
function flipNumberOfEdgeIntervals(shape) {
|
||
if (shape.maximumNumEdgeIntervals === 128) { // 128 is the default number of edges
|
||
return 4; // Reduce the number of edges
|
||
} else {
|
||
return 128;
|
||
}
|
||
}
|
||
|
||
function cycleThroughPathTypes(shape) {
|
||
if (shape.pathType === WorldWind.GREAT_CIRCLE) {
|
||
return WorldWind.RHUMB_LINE;
|
||
}
|
||
else if (shape.pathType === WorldWind.RHUMB_LINE) {
|
||
return WorldWind.LINEAR;
|
||
}
|
||
else {
|
||
return WorldWind.GREAT_CIRCLE;
|
||
}
|
||
}
|
||
|
||
function shiftBoundaries(shape) {
|
||
|
||
// Assuming the shape has two appended properties: shiftCounter and shiftDirection.
|
||
shape.shiftCounter += 1;
|
||
|
||
switch (shape.shiftDirection) {
|
||
case "east":
|
||
shape.boundaries = shiftBoundariesEastward(shape.boundaries);
|
||
break;
|
||
case "west":
|
||
shape.boundaries = shiftBoundariesWestward(shape.boundaries);
|
||
break;
|
||
default:
|
||
console.log("Error. This should never appear");
|
||
}
|
||
|
||
// Shift the shape 5 degrees and then change shift direction
|
||
if (shape.shiftCounter === 5) {
|
||
shape.shiftDirection === "east" ? shape.shiftDirection = "west" : shape.shiftDirection = "east";
|
||
shape.shiftCounter = 0;
|
||
}
|
||
|
||
return shape.boundaries;
|
||
}
|
||
|
||
function shiftBoundariesWestward(boundaries) {
|
||
for (var i = 0; i < boundaries.length; i++) {
|
||
boundaries[i].longitude -= 1;
|
||
}
|
||
return boundaries;
|
||
}
|
||
|
||
function shiftBoundariesEastward(boundaries) {
|
||
for (var i = 0; i < boundaries.length; i++) {
|
||
boundaries[i].longitude += 1;
|
||
}
|
||
return boundaries;
|
||
}
|
||
|
||
// Set up coordinates of 4 different sectors to update SurfaceSector
|
||
var rotatingSectors = [];
|
||
rotatingSectors.push(new WorldWind.Sector(33, 37, -95, -90));
|
||
rotatingSectors.push(new WorldWind.Sector(33, 37, -97, -92));
|
||
rotatingSectors.push(new WorldWind.Sector(31, 35, -97, -92));
|
||
rotatingSectors.push(new WorldWind.Sector(31, 35, -95, -90));
|
||
|
||
// Cycle through the previous array and set it to the SurfaceSector
|
||
function changeSector(surfaceSector) {
|
||
if (surfaceSector.sectorCounter < rotatingSectors.length - 1) {
|
||
surfaceSector.sectorCounter += 1;
|
||
}
|
||
else {
|
||
surfaceSector.sectorCounter = 0;
|
||
}
|
||
return rotatingSectors[surfaceSector.sectorCounter];
|
||
}
|
||
|
||
// Create a layer manager for controlling layer visibility.
|
||
var layerManager = new LayerManager(wwd);
|
||
}); |