-
Notifications
You must be signed in to change notification settings - Fork 459
/
Copy pathRead and write Well Known Text.html
157 lines (130 loc) · 16.2 KB
/
Read and write Well Known Text.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
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
<!DOCTYPE html>
<html lang="en">
<head>
<title>Read and write Well Known Text - Azure Maps Web SDK Samples</title>
<meta charset="utf-8" />
<link rel="shortcut icon" href="/favicon.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="description" content="This sample shows how to read and write Well Known Text (WKT) strings as GeoJSON." />
<meta name="keywords" content="Microsoft maps, map, gis, API, SDK, well known text, wkt, OGC, spatial io module" />
<meta name="author" content="Microsoft Azure Maps" /><meta name="version" content="1.0" />
<meta name="screenshot" content="screenshot.jpg" />
<!-- Add references to the Azure Maps Map control JavaScript and CSS files. -->
<link href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.css" rel="stylesheet" />
<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.js"></script>
<!-- Add reference to the Azure Maps Spatial IO module. -->
<script src="https://atlas.microsoft.com/sdk/javascript/spatial/0/atlas-spatial.min.js"></script>
<script>
var map, datasource, layer, geometries = [];
function getMap() {
//Initialize a map instance.
map = new atlas.Map('myMap', {
view: 'Auto',
//Add authentication details for connecting to Azure Maps.
authOptions: {
//Use Microsoft Entra ID authentication.
authType: 'anonymous',
clientId: 'e6b6ab59-eb5d-4d25-aa57-581135b927f0', //Your Azure Maps client id for accessing your Azure Maps account.
getToken: function (resolve, reject, map) {
//URL to your authentication service that retrieves an Microsoft Entra ID Token.
var tokenServiceUrl = 'https://samples.azuremaps.com/api/GetAzureMapsToken';
fetch(tokenServiceUrl).then(r => r.text()).then(token => resolve(token));
}
//Alternatively, use an Azure Maps key. Get an Azure Maps key at https://azure.com/maps. NOTE: The primary key should be used as the key.
//authType: 'subscriptionKey',
//subscriptionKey: '[YOUR_AZURE_MAPS_KEY]'
}
});
//Wait until the map resources are ready.
map.events.add('ready', function () {
//Create a style control and add it to the map.
map.controls.add(new atlas.control.StyleControl({
mapStyles: 'all'
}), {
position: 'top-right'
});
//Create a data source and add it to the map.
datasource = new atlas.source.DataSource();
map.sources.add(datasource);
//Add a simple data layer for rendering the data.
layer = new atlas.layer.SimpleDataLayer(datasource);
map.layers.add(layer);
});
}
function ReadWKT() {
var wkt = document.getElementById('wktInput').value;
//Split the string on the new line character. Only one Well Known Text string per line allowed.
var s = wkt.split(/[\r\n]+/g);
var geoms = [];
for (var i = 0; i < s.length; i++) {
//Read each line of text as well known text.
var g = atlas.io.ogc.WKT.read(s[i]);
if (g !== null) {
geoms = geoms.concat(g);
}
}
if (geoms.length > 0) {
//Add the parsed geometries to the datasource.
datasource.setShapes(geoms);
geometries = geoms;
map.setCamera({
bounds: atlas.data.BoundingBox.fromData(geoms),
padding: 100
});
} else {
alert('Unable to parse WKT.');
}
}
function WriteWKT() {
if (geometries.length === 0) {
alert('No geometries on map to write.');
} else {
//Convert the GeoJSON geometries into Well Known Text strings.
var wkt = atlas.io.ogc.WKT.write(geometries);
document.getElementById('wktOutput').value = wkt;
}
}
function Clear() {
document.getElementById('wktInput').value = '';
document.getElementById('wktOutput').value = '';
datasource.clear();
}
</script>
<style>
#myMap {
position: relative;
width: calc(100% - 375px);
min-width: 290px;
height: 600px;
float: left;
}
.sidePanel {
width: 325px;
height: 580px;
float: left;
margin-right: 10px;
}
</style>
</head>
<body onload="getMap()">
<fieldset class="sidePanel">
<legend>Read and write Well Known Text</legend>
This sample shows how to read and write Well Known Text (WKT) strings as GeoJSON.
<br /> <br />
<input type='button' onclick='Clear();' value='Clear All' />
<div>
<h3>Read input</h3>
<textarea id='wktInput' rows="8" cols="40">GEOMETRYCOLLECTION(POLYGON((0.74737 51.43939,0.77569 51.37506,0.93703 51.37074,0.74737 51.43939)),POLYGON((-0.93815 60.6285,-0.88291 60.57028,-0.80855 60.60803,-0.93815 60.6285)),POLYGON((-0.96549 60.68994,-0.83578 60.67627,-0.77522 60.79123,-0.8809 60.84471,-0.96549 60.68994)),LINESTRING(-0.91268 60.38681,-0.97598 60.34032),LINESTRING(-1.07489 60.18279,-1.08393 60.10517),POLYGON((-1.17938 60.62434,-1.09654 60.49194,-0.97924 60.65637,-1.07934 60.73516,-1.17938 60.62434)),LINESTRING(-0.93816 50.78817,-1.02016 50.79494),POLYGON((-1.36965 60.40195,-1.34462 60.41767,-1.35921 60.42846,-1.36965 60.40195)),LINESTRING(-1.32185 60.09308,-1.36795 60.04481),POLYGON((-1.60876 60.48298,-1.44531 60.49194,-1.35921 60.42846,-1.29147 60.59933,-1.60876 60.48298)),POLYGON((-1.68963 60.2849,-1.45481 60.15597,-1.41053 60.2586,-1.32873 60.20398,-1.26718 60.2449,-1.37534 59.90839,-1.27405 59.85387,-1.12316 60.14935,-1.21881 60.23808,-1.08905 60.27224,-1.17163 60.34733,-1.03381 60.45032,-1.15116 60.38831,-1.2169 60.49763,-1.34462 60.41767,-1.25979 60.35477,-1.3634 60.28588,-1.68963 60.2849)),POLYGON((-1.56881 50.65779,-1.16786 50.60316,-1.06171 50.69251,-1.29524 50.77292,-1.56881 50.65779)),POLYGON((-2.692 59.192,-2.39486 59.29473,-2.61102 59.29282,-2.692 59.192)),POLYGON((-2.68549 59.08885,-2.53201 59.08332,-2.61428 59.15189,-2.68549 59.08885)),LINESTRING(-2.76802 59.24434,-2.78078 59.14115),POLYGON((-3.07275 59.32418,-2.88463 59.23008,-2.94573 59.3493,-3.07275 59.32418)),POLYGON((-3.03493 58.82602,-2.9393 58.73042,-2.88462 58.81982,-3.03493 58.82602)),POLYGON((-3.11402 59.1581,-2.97467 59.1335,-3.02842 59.18212,-3.11402 59.1581)),POLYGON((-3.32261 58.95687,-3.22734 59.03831,-3.20213 58.91558,-2.71407 58.92519,-2.78947 58.99201,-3.13107 59.00482,-2.99387 59.07304,-3.15554 59.14192,-3.3232 59.12719,-3.32261 58.95687)),POLYGON((-3.43284 58.88468,-3.29868 58.77884,-3.13107 58.80613,-3.24778 58.79192,-3.24543 58.89594,-3.43284 58.88468)),POLYGON((-4.85089 55.98775,-4.8148 56.07026,-4.83854 56.0803,-4.85089 55.98775)),POLYGON((-4.57054 53.39251,-4.41226 53.1318,-4.04231 53.30254,-4.20261 53.29814,-4.32407 53.41917,-4.57054 53.39251)),LINESTRING(-4.56295 53.24169,-4.65514 53.31951),LINESTRING(-5.00879 55.729,-5.16632 55.92062),POLYGON((-5.34507 55.4824,-5.11718 55.43946,-5.14539 55.65475,-5.29665 55.72254,-5.34507 55.4824)),LINESTRING(-5.50211 56.42085,-5.58407 56.38674),LINESTRING(-5.58408 56.32525,-5.62108 56.27584),LINESTRING(-5.61198 56.26321,-5.63684 56.189),LINESTRING(-5.92483 57.29144,-6.01329 57.3172),LINESTRING(-5.98193 57.49711,-6.05412 57.32612),POLYGON((-6.06182 55.80921,-5.96147 55.8045,-5.77956 56.02051,-5.71533 56.15285,-5.9827 56.0086,-5.88571 55.97581,-6.07454 55.91571,-6.06182 55.80921)),LINESTRING(-6.15944 56.46922,-6.2631 56.48291),LINESTRING(-6.13272 56.11239,-6.2693 56.03725),POLYGON((-6.45487 57.00365,-6.30304 56.94371,-6.2693 57.0173,-6.45487 57.00365)),POLYGON((-6.35643 56.33605,-6.29943 56.26781,-5.80819 56.31866,-5.65699 56.39984,-6.03283 56.61856,-6.32454 56.6058,-6.30708 56.53702,-6.00265 56.48906,-6.20254 56.38002,-6.03929 56.37072,-6.35643 56.33605)),LINESTRING(-6.17375 55.3036,-6.28294 55.29683),LINESTRING(-6.51528 57.05039,-6.60572 57.05148),LINESTRING(-6.79071 58.20968,-6.86053 58.25303),POLYGON((-6.77258 57.43381,-6.67186 57.35572,-6.53001 57.41515,-6.32335 57.31108,-6.48159 57.31154,-6.31773 57.1607,-6.16388 57.20103,-6.08808 57.12716,-6.04337 57.22958,-5.84473 57.18804,-6.00239 57.09926,-5.95283 57.03389,-5.64681 57.26436,-6.15319 57.30529,-6.15319 57.5893,-6.31023 57.7026,-6.41508 57.64555,-6.31023 57.46233,-6.63982 57.60697,-6.60618 57.44368,-6.71532 57.51391,-6.77258 57.43381)),POLYGON((-6.49037 55.67154,-6.24946 55.7766,-6.31054 55.58297,-6.0228 55.68162,-6.10171 55.83096,-6.13959 55.94108,-6.31023 55.81817,-6.3308 55.88971,-6.45213 55.8406,-6.49037 55.67154)),POLYGON((-5.70851 50.13239,-5.66671 50.04253,-5.49509 50.12939,-5.32336 50.08919,-5.1905 49.95887,-5.05594 50.06036,-5.12539 50.09606,-5.05237 50.19549,-5.00191 50.14392,-4.69374 50.34318,-4.1931 50.32199,-4.28937 50.39708,-4.19992 50.45919,-4.05368 50.30008,-3.64505 50.22577,-3.48676 50.40452,-3.55567 50.43186,-3.46382 50.6783,-3.36757 50.61681,-2.86424 50.73355,-2.45274 50.52741,-2.39771 50.64528,-1.96461 50.60193,-2.0384 50.7397,-1.56065 50.71877,-1.31674 50.8,-1.46582 50.91788,-1.15054 50.78114,-1.16414 50.84336,-1.06859 50.84336,-1.08228 50.78067,-0.93862 50.84294,-0.78943 50.72977,-0.2691 50.83106,0.27159 50.74714,0.76308 50.93064,0.98033 50.91787,1.02818 51.04133,1.40542 51.18323,1.42434 51.39185,0.97785 51.34896,0.57705 51.39332,0.69539 51.47675,0.38513 51.45288,0.92504 51.58804,0.93072 51.74335,0.69921 51.71977,0.98033 51.8433,1.06601 51.775,1.27696 51.84454,1.20006 51.87743,1.28264 51.94634,1.06973 51.95316,1.27158 51.95613,1.15841 52.02822,1.33287 51.9398,1.58288 52.08124,1.77171 52.48569,1.6976 52.73076,1.39664 52.89117,0.96669 52.97416,0.52093 52.95501,0.38512 52.76812,0.01088 52.88618,0.33637 53.09319,0.24549 53.39059,-0.27882 53.7068,-0.72592 53.70034,-0.25985 53.73512,0.13191 53.57317,-0.21887 54.02249,-0.07483 54.11189,-0.36987 54.24744,-0.56236 54.47714,-1.2031 54.62545,-1.63031 55.58482,-1.81593 55.63258,-2.13736 55.91437,-2.63454 56.05774,-3.07766 55.94656,-3.65556 56.00997,-3.83689 56.10614,-3.34214 56.02687,-2.96369 56.20536,-2.64782 56.22845,-2.57625 56.2837,-2.8021 56.34511,-2.87436 56.44392,-2.72709 56.46922,-2.51387 56.59122,-1.75868 57.47329,-1.99711 57.7026,-3.03436 57.66832,-3.40852 57.72304,-4.08321 57.58589,-4.19421 57.4913,-4.26198 57.55173,-4.00882 57.68831,-4.42787 57.57723,-4.2942 57.67992,-3.98769 57.69576,-3.77894 57.85541,-4.03931 57.81787,-4.39179 57.90799,-4.00882 57.86768,-4.08383 57.96385,-4.00138 57.93535,-3.12918 58.36894,-3.01847 58.64004,-3.34736 58.65182,-3.36343 58.60056,-4.3165 58.54547,-4.49484 58.44925,-4.47494 58.56532,-4.76045 58.4477,-4.65953 58.55555,-4.77591 58.60691,-4.81756 58.52439,-4.83539 58.60475,-5.00442 58.61741,-5.10508 58.50527,-5.01558 58.38786,-5.14245 58.41447,-5.17257 58.35365,-4.933 58.2227,-5.39147 58.2611,-5.24146 58.14761,-5.30016 58.06987,-5.44641 58.08405,-5.0701 57.83293,-5.36553 57.94282,-5.22094 57.8466,-5.61198 57.92851,-5.60516 57.77022,-5.69802 57.86882,-5.81057 57.83293,-5.67347 57.70943,-5.8053 57.64243,-5.51204 57.54119,-5.83858 57.57907,-5.80716 57.35469,-5.44749 57.42143,-5.72872 57.2979,-5.4401 57.31898,-5.40656 57.22958,-5.57761 57.26648,-5.68024 57.1576,-5.39969 57.10608,-5.71497 57.11977,-5.77956 57.05148,-5.52258 56.99688,-5.83109 56.99688,-5.92043 56.89379,-5.65983 56.87271,-5.85052 56.82868,-5.756 56.78455,-6.23473 56.7122,-5.54309 56.6952,-6.00751 56.64197,-5.67348 56.49655,-5.11919 56.81808,-5.23763 56.71633,-4.99506 56.71566,-5.31716 56.66104,-5.41339 56.54441,-5.24146 56.56487,-5.45431 56.46922,-5.28095 56.46423,-5.57193 56.32783,-5.53095 56.08598,-5.70691 55.94232,-5.57043 56.03725,-5.65983 55.79711,-5.45431 55.84543,-5.68025 55.67418,-5.77166 55.30102,-5.52434 55.35833,-5.48951 55.6443,-5.31716 55.7828,-5.44377 56.02733,-5.04896 56.23678,-4.91993 56.2775,-5.33757 55.9963,-5.29613 55.85236,-5.20053 55.83122,-5.18002 55.96899,-5.08594 55.90093,-5.12296 56.00966,-4.9684 55.87959,-4.91993 56.16758,-4.85104 56.11239,-4.75498 56.20626,-4.8148 56.07026,-4.48114 55.92803,-4.88598 55.91938,-4.91993 55.70833,-4.61718 55.49537,-5.00726 55.14092,-4.99506 54.92001,-5.11454 55.03121,-5.17707 54.99024,-4.94354 54.65248,-4.85843 54.63263,-4.95427 54.80451,-4.85843 54.86601,-4.38182 54.67982,-4.40226 54.90698,-4.01112 54.76792,-3.81638 54.8859,-3.5812 54.88332,-3.56991 54.99515,-3.02126 54.9753,-3.38733 54.88311,-3.63355 54.51264,-3.30612 54.19158,-3.2068 54.26274,-3.24039 54.11189,-3.14477 54.06347,-3.04862 54.22176,-2.93863 54.15478,-2.7953 54.24847,-2.85739 53.96725,-3.05601 53.90586,-3.04862 53.76928,-2.89829 53.73512,-3.10133 53.55777,-2.92434 53.34966,-2.69913 53.35152,-2.88091 53.28807,-3.05767 53.43446,-3.18572 53.3925,-3.08727 53.2344,-3.32974 53.35153,-3.60156 53.28861,-3.87774 53.33731,-3.83064 53.28887,-4.17734 53.21737,-4.76224 52.78924,-4.51592 52.78923,-4.40603 52.89228,-4.07703 52.92641,-4.1484 52.81179,-3.98768 52.73399,-4.12489 52.60366,-3.9467 52.54899,-4.31521 52.21601,-4.84076 52.01455,-5.06953 52.02608,-5.31034 51.86374,-5.12519 51.8557,-5.10968 51.77819,-5.2489 51.73343,-5.18219 51.68904,-4.91006 51.71791,-4.82373 51.79547,-4.84427 51.71359,-5.11919 51.67822,-4.94548 51.59729,-4.36443 51.7888,-4.31469 51.67729,-4.06995 51.67568,-4.28937 51.61672,-4.28937 51.5553,-3.8542 51.62362,-3.55686 51.4048,-3.28876 51.38397,-2.38019 51.76165,-2.97405 51.38397,-3.02126 51.19217,-4.1517 51.21134,-4.30169 51.00723,-4.52584 51.01467,-4.57679 50.77452,-4.79182 50.59495,-4.91992 50.5889,-4.84427 50.51377,-4.99506 50.54792,-5.31422 50.25332,-5.70851 50.13239)),POLYGON((-6.70127 56.58533,-6.5635 56.59838,-6.45193 56.68812,-6.70127 56.58533)),LINESTRING(-6.99675 57.91481,-7.07861 57.88011),POLYGON((-7.12449 57.83668,-6.98021 57.7348,-6.74127 57.83122,-6.78638 57.89853,-6.66034 57.88011,-6.67397 57.96934,-6.61874 57.91481,-6.45487 57.96949,-6.54428 58.01726,-6.35188 58.03832,-6.4065 58.10664,-6.61874 58.08617,-6.37234 58.1408,-6.39958 58.20968,-6.15944 58.2165,-6.36552 58.23702,-6.19505 58.35597,-6.26677 58.51173,-6.81801 58.28476,-6.70876 58.18922,-6.86891 58.18922,-6.85893 58.10663,-6.90668 58.2165,-7.04951 58.23211,-7.11219 58.09981,-6.93402 58.05201,-7.1122 57.98998,-6.83852 57.93535,-7.12449 57.83668),(-6.68119 58.01646,-6.68762 58.05827,-6.5914 58.05826,-6.68119 58.01646)),POLYGON((-6.98931 56.5034,-6.88105 56.44397,-6.74121 56.54758,-6.98931 56.5034)),POLYGON((-7.39559 57.43371,-7.2048 57.41831,-7.29187 57.48502,-7.39559 57.43371)),POLYGON((-7.45476 57.23643,-7.35239 57.09926,-7.23849 57.10024,-7.35239 57.24266,-7.19473 57.30529,-7.35239 57.40776,-7.45476 57.23643)),POLYGON((-7.54421 57.59269,-7.1569 57.51081,-7.31141 57.54429,-7.12501 57.5708,-7.21524 57.64113,-7.07344 57.64607,-7.18857 57.6548,-7.47595 57.6616,-7.54421 57.59269)),POLYGON((-7.55615 56.95275,-7.38133 56.98727,-7.44861 57.05828,-7.55615 56.95275)),POLYGON((-8.17384 54.46174,-7.85644 54.21142,-7.31032 54.11468,-7.15333 54.22424,-7.19245 54.33472,-7.01784 54.41317,-6.64034 54.16801,-6.63062 54.04182,-6.35482 54.11065,-6.07903 54.03422,-5.89315 54.10445,-5.86142 54.23028,-5.57885 54.2754,-5.57901 54.3834,-5.70815 54.35152,-5.62506 54.516,-5.71497 54.53647,-5.57467 54.52872,-5.50139 54.33937,-5.43013 54.48494,-5.53596 54.65718,-5.74727 54.68013,-5.90684 54.60535,-5.70138 54.82446,-5.9857 54.98145,-6.10032 55.21208,-6.43937 55.23575,-6.96197 55.19441,-7.06445 55.04351,-7.37699 55.02889,-7.54307 54.74167,-7.92967 54.69672,-7.70787 54.60416,-8.17384 54.46174)))</textarea>
<br /> <br />
<input type='button' onclick='ReadWKT();' value='Read WKT' />
</div>
<div>
<h3>Write output</h3>
<input type='button' onclick='WriteWKT();' value='Write WKT' />
<br /> <br />
<textarea id='wktOutput' rows="8" cols="40"></textarea>
</div>
</fieldset>
<div id="myMap"></div>
</body>
</html>