archive-gh-me/WebWorldWind
1
0
Fork 0
mirror of https://github.com/NASAWorldWind/WebWorldWind.git synced 2026-02-01 16:38:15 +00:00
Code Issues Projects Releases Wiki Activity

EU Countries support.

Browse Source
This commit is contained in:
Jakub Balhar 2016-01-19 09:34:35 +01:00
parent 53b2b22afb
commit 9088a96337
3 changed files with 184 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
examples/KmlEuCountries.html Normal file
View File

@ -0,0 +1,54 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js" type="text/javascript"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script data-main="KmlEuCountries"
src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.17/require.min.js"></script>
</head>
<body>
<div class="container">
<div class="jumbotron hidden-xs">
<h1 style="text-align:center">Kml TimeStamp</h1>
</div>
<div class="row">
<div class="col-sm-3">
<h4>Projection</h4>
<div class="dropdown" id="projectionDropdown">
</div>
<br>
<h4>Layers</h4>
<div class="list-group" id="layerList">
</div>
<br>
<h4>Destination</h4>
<div class="input-group" id="searchBox">
<input type="text" class="form-control" placeholder="GoTo" id="searchText"/>
<span class="input-group-btn">
<button id="searchButton" class="btn btn-primary" type="button">
<span class="glyphicon glyphicon-search"></span>
</button>
</span>
</div>
<br>
<h4>KML time interval</h4>
<p>
<input type="text" id="range" readonly style="border:0; color:#f6931f; font-weight:bold; width: 280px">
</p>
<div id="time-slider"></div>
</div>
<div class="col-sm-9" id="globe">
<canvas id="canvasOne" width="1000" height="1000" style="width: 100%; height: auto">
Your browser does not support HTML5 Canvas.
</canvas>
</div>
</div>
</div>
</body>
</html>

130
examples/KmlEuCountries.js Normal file
View File

@ -0,0 +1,130 @@
/*
* Copyright (C) 2014 United States Government as represented by the Administrator of the
* National Aeronautics and Space Administration. All Rights Reserved.
*/
requirejs(['../src/WorldWind',
'../src/formats/kml/KmlFile',
'./LayerManager',
'../src/util/Date'],
function (WorldWind,
KmlFile,
LayerManager,
DateWW) {
WorldWind.Logger.setLoggingLevel(WorldWind.Logger.LEVEL_WARNING);
var wwd = new WorldWind.WorldWindow("canvasOne");
function getDateFormat(dateTime) {
var date = new Date(dateTime);
var year = date.getFullYear().toString();
var month = (date.getMonth() + 1).toString();
return month + "/" + year;
}
var layers = [
{layer: new WorldWind.BMNGLayer(), enabled: true},
{layer: new WorldWind.BMNGLandsatLayer(), enabled: false},
{layer: new WorldWind.BingAerialLayer(null), enabled: false},
{layer: new WorldWind.BingAerialWithLabelsLayer(null), enabled: true},
{layer: new WorldWind.BingRoadsLayer(null), enabled: false},
{layer: new WorldWind.OpenStreetMapImageLayer(null), enabled: false},
{layer: new WorldWind.CompassLayer(), enabled: true},
{layer: new WorldWind.CoordinatesDisplayLayer(wwd), enabled: true},
{layer: new WorldWind.ViewControlsLayer(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 manager for controlling layer visibility.
new LayerManager(wwd);
// Now set up to handle highlighting.
new WorldWind.HighlightController(wwd);
var renderableLayer = new WorldWind.RenderableLayer("Surface Shapes");
wwd.addLayer(renderableLayer);
var TimeControl = function () {
var initialized = false;
var min = new DateWW();
var max = new DateWW("January 1, 1000");
this.compareAgainstOne = function (date) {
if(!date) {
return;
}
if (min.isAfter(date)) {
min = new DateWW(date);
}
if (max.isBefore(date)) {
max = new DateWW(date);
}
};
this.getMin = function () {
return min.getTime();
};
this.getMax = function () {
return max.getTime();
};
this.hook = function (node, options) {
if (options.isTimeSpan) {
var begin = node.kmlBegin;
var end = node.kmlEnd;
this.compareAgainstOne(begin);
this.compareAgainstOne(end);
} else if (options.isTimeStamp) {
var when = node.kmlWhen;
this.compareAgainstOne(when);
}
if (!initialized) {
$("#time-slider").slider({
range: true,
min: this.getMin(),
max: this.getMax(),
values: [this.getMin(), this.getMax()],
slide: function (event, ui) {
kmlFile.update(
{
layer: renderableLayer,
timeInterval: [ui.values[0], ui.values[1]]
}
);
$("#range").val("Time interval: " + getDateFormat(ui.values[0]) + " - " +
getDateFormat(ui.values[1]));
wwd.redraw();
}
});
$("#range").val("Time interval: " + getDateFormat(this.getMin()) + " - " +
getDateFormat(this.getMax()));
initialized = true;
} else {
$("#time-slider").slider("option", "min", this.getMin());
$("#time-slider").slider("option", "max", this.getMax());
$("#time-slider").slider("option", "values", [this.getMin(), this.getMax()]);
$("#range").val("Time interval: " + getDateFormat(this.getMin()) + " - " +
getDateFormat(this.getMax()));
}
};
};
var timeControl = new TimeControl();
var kmlFile;
var kmlFileOptions = {
url: 'eu_countries.kml',
controls: [timeControl]
};
var kmlFilePromise = new KmlFile(kmlFileOptions);
kmlFilePromise.then(function (pKmlFile) {
kmlFile = pKmlFile;
kmlFile.update({layer: renderableLayer, controls: [timeControl]});
});
});

BIN
examples/eu_countries.kml Normal file
View File

Binary file not shown.