Files
openlayers/master/examples/Cesium Viewer Widget.html
Éric Lemoine 5d14b9e2d4 Updated
2013-02-20 10:38:25 +01:00

93 lines
3.4 KiB
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, height=device-height, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta name="description" content="Drag and drop CZML files onto the Cesium Viewer Widget to visualize time dynamic data.">
<title>Cesium Demo</title>
<script type="text/javascript" src="../Sandcastle-header.js"></script>
<script data-dojo-config="async: 1, tlmSiblingOfDojo: 0" src="../../../ThirdParty/dojo-release-1.7.2-src/dojo/dojo.js"></script>
<script type="text/javascript">
require({
baseUrl : '../../..',
packages: [
{ name: 'dojo', location: 'ThirdParty/dojo-release-1.7.2-src/dojo' },
{ name: 'dijit', location: 'ThirdParty/dojo-release-1.7.2-src/dijit' },
{ name: 'dojox', location: 'ThirdParty/dojo-release-1.7.2-src/dojox' },
{ name: 'Assets', location: 'Source/Assets' },
{ name: 'Core', location: 'Source/Core' },
{ name: 'DynamicScene', location: 'Source/DynamicScene' },
{ name: 'Renderer', location: 'Source/Renderer' },
{ name: 'Scene', location: 'Source/Scene' },
{ name: 'Shaders', location: 'Source/Shaders' },
{ name: 'ThirdParty', location: 'Source/ThirdParty' },
{ name: 'Widgets', location: 'Source/Widgets' },
{ name: 'Workers', location: 'Source/Workers' }
]
});
</script>
<link rel="Stylesheet" href="../../../ThirdParty/dojo-release-1.7.2-src/dijit/themes/claro/claro.css" type="text/css">
<link rel="Stylesheet" href="../../../Source/Widgets/Dojo/CesiumViewerWidget.css" type="text/css">
</head>
<body class="claro" data-sandcastle-bucket="bucket-dojo.html" data-sandcastle-title="Cesium + Dojo">
<style>
body {
background: #000;
color: #eee;
font-family: sans-serif;
font-size: 9pt;
padding: 0;
margin: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
.fullSize {
display: block;
position: absolute;
top: 0;
left: 0;
border: none;
width: 100%;
height: 100%;
}
#toolbar {
margin: 5px;
padding: 2px 5px;
position: absolute;
}
</style>
<div id="cesiumContainer" class="fullSize"></div>
<div id="toolbar">Loading...</div>
<script id="cesium_sandcastle_script">
require([
'Source/Cesium', 'Widgets/Dojo/CesiumViewerWidget',
'dojo/on', 'dojo/dom', 'dojo/io-query'
], function(
Cesium, CesiumViewerWidget,
on, dom, ioQuery)
{
"use strict";
// Ask Dojo to parse URL configuration options
var endUserOptions = {};
if (window.location.search) {
endUserOptions = ioQuery.queryToObject(window.location.search.substring(1));
}
// Initialize a viewer capable of drag-and-drop
// and user customizations.
var widget = new CesiumViewerWidget({
endUserOptions : endUserOptions,
enableDragDrop : true
});
widget.placeAt(dom.byId('cesiumContainer'));
widget.startup();
dom.byId('toolbar').innerHTML = '';
});
</script>
</body>
</html>