forked from NASAWorldWind/WebWorldWind
-
Notifications
You must be signed in to change notification settings - Fork 1
/
ShapeEditor.html
63 lines (62 loc) · 3 KB
/
ShapeEditor.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
<!DOCTYPE html>
<html lang="en">
<head>
<!--NOTE: Most Web World Wind examples use jquery, Bootstrap and requirejs but those technologies are NOT-->
<!--required by Web World Wind. See SimplestExample.html for an example of using Web World Wind without them.-->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js" type="text/javascript"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script data-main="ShapeEditor" 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">WorldWind Shape Editor</h1>
</div>
<div class="row">
<div class="col-sm-12">
<div class="alert alert-info">
<p>
Dragging the body of the shape moves the whole shape. Dragging a control point performs the action associated
with that control point. The editor provides vertex insertion and removal for SurfacePolygon and
SurfacePolyline. Single click when the cursor is over a shadow control point of a shape inserts a control point at
that position. Double click when the cursor is over a control point removes that particular control point.
</p>
<p>
You can also manage the actions available for a particular shape by calling the edit method of ShapeEditor with the desired options.
You can enable or disable move, reshape and rotate actions and you can also choose if control points can be added/removed (default values - all action are allowed).
</p>
</div>
</div>
</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>
</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>