Skip to content

Instantly share code, notes, and snippets.

@tyrasd

tyrasd/index.html

Forked from milkbread/index.html
Last active March 23, 2023 18:53
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save tyrasd/829d090e2400fd1ca59e9b2523847d28 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save tyrasd/829d090e2400fd1ca59e9b2523847d28 to your computer and use it in GitHub Desktop.
Download ZIP
JavaScript: Convert GeoJSON Polygon to WKT
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<title>Convert GeoJSON</title>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="poly.js"></script>
</head>
<body>
<h1>Convert <a href="http://geojson.org/geojson-spec.html#appendix-a-geometry-examples">GeoJSON-Polygon</a> to <a href="http://en.wikipedia.org/wiki/Well-known_text">WKT-POLYGON</a></h1>
<div class='block'>
<div>
<h1>Input: GeoJSON</h1>
<textarea id="geojson-input" placeholder="Paste GeoJSON here"></textarea>
<p class = 'convert' id='convert'>Convert</p>
</div>
</div>
<div class='block'>
<div>
<h1>Output: GeoJSON</h1>
<textarea id="geojson-output" placeholder="Resulting WKT will be displayed here"></textarea>
</div>
</div>
</body>
<script>
d3.select('#convert').on('mouseup',function(){convert();})
//initialise input of textarea
d3.select('#geojson-input').text(JSON.stringify(Polygon, null, 4));
function convert(){
console.log('hey')
//initialize json-textarea-input
var input = $('#geojson-input').val();
//get the input as json-object
var input_json = JSON.parse(input);
//console.log(input_json)
//convert the json-input to WKT
var wkt_str = 'POLYGON('+
input_json.coordinates.map(function(ring){
return '(' + ring.map(function(p) {
return p[0] + ' ' + p[1];
}).join(', ') + ')';
}).join(', ')+')';
//fill the resulting WKT-Polygon to output textarea
d3.select('#geojson-output').text(wkt_str);
}
</script>
</html>
Raw
poly.js
var Polygon = {
"type": "LineString",
"coordinates": [
[
2.32986,
48.86005
],
[
2.35093,
48.863411
],
[
2.43115,
48.940418
],
[
2.54246,
48.960732
],
[
2.63999,
49.001961
],
[
2.72844,
49.08049
],
[
2.73925,
49.098728
],
[
2.77004,
49.111778
],
[
2.80339,
49.144669
],
[
2.85119,
49.15979
],
[
2.99549,
49.23616
],
[
3.03301,
49.241539
],
[
3.08543,
49.26516
],
[
3.13198,
49.266472
],
[
3.18086,
49.294731
],
[
3.21429,
49.302959
],
[
3.28301,
49.356419
],
[
3.3289,
49.35873
],
[
3.35653,
49.368698
],
[
3.37508,
49.387329
],
[
3.3684,
49.40694
],
[
3.40955,
49.42358
],
[
3.43405,
49.446411
],
[
3.51661,
49.463291
],
[
3.58582,
49.519058
],
[
3.59405,
49.535789
],
[
3.62701,
49.551029
],
[
3.63567,
49.573921
],
[
3.65985,
49.59404
],
[
3.71867,
49.705761
],
[
3.80852,
49.78054
],
[
3.9306,
49.8503
],
[
4.00552,
49.867611
],
[
4.02625,
49.889511
],
[
4.06293,
49.90406
],
[
4.09659,
49.905418
],
[
4.10586,
49.934929
],
[
4.14826,
49.948738
],
[
4.16724,
49.974251
],
[
4.20531,
49.97723
],
[
4.31856,
50.0275
],
[
4.37885,
50.030609
],
[
4.46792,
50.070969
],
[
4.46888,
50.083069
],
[
4.49986,
50.102741
],
[
4.49368,
50.127609
],
[
4.50478,
50.152081
],
[
4.52658,
50.17326
],
[
4.53016,
50.19585
],
[
4.55226,
50.203079
],
[
4.57809,
50.246059
],
[
4.60485,
50.252739
],
[
4.65955,
50.304298
],
[
4.71331,
50.31625
],
[
4.73277,
50.346191
],
[
4.74492,
50.346069
],
[
4.77921,
50.37978
],
[
4.82965,
50.398071
],
[
4.84423,
50.415329
],
[
4.86628,
50.42218
],
[
4.85599,
50.445961
],
[
4.86486,
50.45866
],
[
4.89671,
50.468529
],
[
4.94456,
50.503571
],
[
5.00459,
50.525509
],
[
5.0625,
50.5825
],
[
5.12338,
50.591831
],
[
5.14038,
50.606461
],
[
5.14052,
50.615791
],
[
5.17591,
50.62899
],
[
5.19067,
50.649441
],
[
5.23795,
50.676979
],
[
5.3241,
50.72472
],
[
5.36659,
50.737
],
[
5.46203,
50.78297
],
[
5.59527,
50.811749
],
[
5.66683,
50.840649
],
[
5.69181,
50.859291
],
[
5.70955,
50.859509
],
[
5.78653,
50.907829
],
[
5.83605,
50.9123
],
[
5.96387,
50.980091
],
[
6.14661,
51.039459
],
[
6.15822,
51.053169
],
[
6.17824,
51.055672
],
[
6.21046,
51.077419
],
[
6.25705,
51.084091
],
[
6.2703,
51.098911
],
[
6.33651,
51.12685
],
[
6.36855,
51.158169
],
[
6.42585,
51.195591
],
[
6.43804,
51.19519
],
[
6.47667,
51.218029
],
[
6.48883,
51.22998
],
[
6.47779,
51.252701
],
[
6.5801,
51.331532
],
[
6.69558,
51.36377
],
[
6.75227,
51.371132
],
[
6.81237,
51.399792
],
[
6.84989,
51.429039
],
[
6.87801,
51.431438
],
[
6.93167,
51.462551
],
[
6.97855,
51.47644
],
[
6.98048,
51.488819
],
[
7.00807,
51.496368
],
[
7.01853,
51.508781
],
[
7.0581,
51.51609
],
[
7.08124,
51.53183
],
[
7.19856,
51.544189
],
[
7.24011,
51.55888
],
[
7.31798,
51.557789
],
[
7.36123,
51.57444
],
[
7.38654,
51.575272
],
[
7.42589,
51.595341
],
[
7.54105,
51.608761
],
[
7.59659,
51.636028
],
[
7.70191,
51.658932
],
[
7.70489,
51.672791
],
[
7.74593,
51.686958
],
[
7.92157,
51.708809
],
[
8.03324,
51.75507
],
[
8.07623,
51.76083
],
[
8.19468,
51.80426
],
[
8.21855,
51.80405
],
[
8.35782,
51.849621
],
[
8.44433,
51.859482
],
[
8.49079,
51.879719
],
[
8.5841,
51.884579
],
[
8.60752,
51.900669
],
[
8.66277,
51.90995
],
[
8.69632,
51.90266
],
[
8.72335,
51.909081
],
[
8.7726,
51.906609
],
[
8.90044,
51.947609
],
[
8.91911,
51.945801
],
[
8.9343,
51.95689
],
[
9.00241,
51.956379
],
[
9.09687,
51.99094
],
[
9.15502,
51.99136
],
[
9.33535,
52.079762
],
[
9.35207,
52.090561
],
[
9.34909,
52.101231
],
[
9.36184,
52.104111
],
[
9.41245,
52.10014
],
[
9.48007,
52.10656
],
[
9.53231,
52.12204
],
[
9.56786,
52.110561
],
[
9.60129,
52.084061
],
[
9.61335,
52.084469
],
[
9.73862,
52.124001
],
[
9.76815,
52.149029
],
[
9.85091,
52.159939
],
[
9.93417,
52.153461
],
[
10.01568,
52.160728
],
[
10.12938,
52.199108
],
[
10.15967,
52.20097
],
[
10.26939,
52.233261
],
[
10.33079,
52.25803
],
[
10.38941,
52.26247
],
[
10.40875,
52.256908
],
[
10.5142,
52.26252
],
[
10.6691,
52.245571
],
[
10.79077,
52.25753
],
[
10.84149,
52.234901
],
[
10.88113,
52.22681
],
[
10.99778,
52.229191
],
[
11.03062,
52.217602
],
[
11.05477,
52.22015
],
[
11.11851,
52.208031
],
[
11.35227,
52.18716
],
[
11.43668,
52.188049
],
[
11.52164,
52.164879
],
[
11.62238,
52.187531
],
[
11.68052,
52.218311
],
[
11.76374,
52.229019
],
[
12.05675,
52.23267
],
[
12.2143,
52.252441
],
[
12.29568,
52.247169
],
[
12.34305,
52.26495
],
[
12.44244,
52.2799
],
[
12.50953,
52.33836
],
[
12.55295,
52.351181
],
[
12.60367,
52.349911
],
[
12.66093,
52.335209
],
[
12.80768,
52.337711
],
[
12.91879,
52.290451
],
[
12.97733,
52.3036
],
[
13.24849,
52.300331
],
[
13.27942,
52.30859
],
[
13.44054,
52.30608
],
[
13.51074,
52.319302
],
[
13.64603,
52.310699
],
[
13.7164,
52.324501
],
[
13.8241,
52.310299
],
[
13.89843,
52.316368
],
[
13.95759,
52.31155
],
[
14.0635,
52.33419
],
[
14.18073,
52.343922
],
[
14.29105,
52.324291
],
[
14.54354,
52.314289
],
[
14.75599,
52.33532
],
[
14.84256,
52.328499
],
[
14.95564,
52.338371
],
[
15.06221,
52.32468
],
[
15.16572,
52.325298
],
[
15.28446,
52.294231
],
[
15.39406,
52.318531
],
[
15.54209,
52.32399
],
[
15.65358,
52.29948
],
[
15.71254,
52.296532
],
[
15.83711,
52.327572
],
[
15.93636,
52.330448
],
[
16.130489,
52.36385
],
[
16.448879,
52.390018
],
[
16.5352,
52.385269
],
[
16.62204,
52.356419
],
[
16.67141,
52.348579
],
[
16.88826,
52.35461
],
[
17.004881,
52.345322
],
[
17.170919,
52.307411
],
[
17.362419,
52.310108
],
[
17.440769,
52.31905
],
[
17.521919,
52.316971
],
[
17.549561,
52.30616
],
[
17.554529,
52.313641
],
[
17.62093,
52.32695
],
[
17.78367,
52.318829
],
[
17.890829,
52.282341
],
[
17.98637,
52.313019
],
[
18.00901,
52.336861
],
[
18.069059,
52.358261
],
[
18.130541,
52.36541
],
[
18.158409,
52.394329
],
[
18.18281,
52.39386
],
[
18.225611,
52.376949
],
[
18.30847,
52.370152
],
[
18.41881,
52.3894
],
[
18.527161,
52.38678
],
[
18.615891,
52.398628
],
[
18.68129,
52.39312
],
[
18.7043,
52.405609
],
[
18.732691,
52.405029
],
[
18.762569,
52.420631
],
[
18.80508,
52.4128
],
[
18.86809,
52.426079
],
[
18.89086,
52.418201
],
[
18.94124,
52.419811
],
[
19.0529,
52.404129
],
[
19.164961,
52.40538
],
[
19.24848,
52.423641
],
[
19.305229,
52.41375
],
[
19.35132,
52.43359
],
[
19.396641,
52.44128
],
[
19.429609,
52.44141
],
[
19.46174,
52.42918
],
[
19.482149,
52.444271
],
[
19.611401,
52.465778
],
[
19.654921,
52.491261
],
[
19.648609,
52.504318
],
[
19.70643,
52.546162
],
[
19.816271,
52.573441
],
[
19.88517,
52.606121
],
[
19.91324,
52.607239
],
[
19.98106,
52.63168
],
[
20.05653,
52.647541
],
[
20.33197,
52.61694
],
[
20.440701,
52.62476
],
[
20.49379,
52.65279
],
[
20.52486,
52.659981
],
[
20.570709,
52.66391
],
[
20.655951,
52.65588
],
[
20.707939,
52.67017
],
[
20.7414,
52.666321
],
[
20.81212,
52.68528
],
[
20.89023,
52.694012
],
[
21.043341,
52.67868
],
[
21.0809,
52.696308
],
[
21.09758,
52.69495
],
[
21.115641,
52.708408
],
[
21.31554,
52.724289
],
[
21.361641,
52.716061
],
[
21.39842,
52.698738
],
[
21.590389,
52.685459
],
[
21.59984,
52.694321
],
[
21.63352,
52.685341
],
[
21.85906,
52.784401
],
[
21.87155,
52.79987
],
[
21.89496,
52.802479
],
[
22.24649,
52.987999
],
[
22.4666,
53.090141
],
[
22.924431,
53.164379
],
[
22.9757,
53.163528
],
[
23.159651,
53.135971
],
[
23.196211,
53.120152
],
[
23.233709,
53.126122
],
[
23.41815,
53.12582
],
[
23.44846,
53.13739
],
[
23.50668,
53.14436
],
[
23.643511,
53.10825
],
[
23.796881,
53.108688
],
[
23.87129,
53.124249
],
[
24.06872,
53.116779
],
[
24.450899,
53.15369
],
[
24.47839,
53.14238
],
[
24.557699,
53.150539
],
[
24.71763,
53.137539
],
[
24.85112,
53.146969
],
[
25.131519,
53.118011
],
[
25.25131,
53.08876
],
[
25.303431,
53.086411
],
[
25.32103,
53.09425
],
[
25.41754,
53.097252
],
[
25.488529,
53.087769
],
[
25.59878,
53.1077
],
[
25.715191,
53.146481
],
[
25.90134,
53.13982
],
[
25.92585,
53.132629
],
[
26.067511,
53.181671
],
[
26.120001,
53.20966
],
[
26.330429,
53.266708
],
[
26.599449,
53.402821
],
[
26.76107,
53.50737
],
[
26.81377,
53.51268
],
[
26.96689,
53.55397
],
[
27.03907,
53.58942
],
[
27.05237,
53.619888
],
[
27.089849,
53.66666
],
[
27.303511,
53.73513
],
[
27.391319,
53.803421
],
[
27.432171,
53.817829
],
[
27.475559,
53.849411
],
[
27.49699,
53.85548
],
[
27.49404,
53.869808
],
[
27.5397,
53.88554
],
[
27.58568,
53.916759
],
[
27.71962,
53.955311
],
[
27.854549,
54.008701
],
[
27.997959,
54.030449
],
[
28.33709,
54.106628
],
[
28.48181,
54.20295
],
[
28.49527,
54.226021
],
[
28.51235,
54.237518
],
[
28.57115,
54.255291
],
[
28.770069,
54.27718
],
[
28.802771,
54.290051
],
[
28.876591,
54.29155
],
[
29.036091,
54.31271
],
[
29.166031,
54.364811
],
[
29.304399,
54.37254
],
[
29.807631,
54.477001
],
[
29.89637,
54.473911
],
[
30.11908,
54.506271
],
[
30.195641,
54.542679
],
[
30.27557,
54.55484
],
[
30.32493,
54.575699
],
[
30.35874,
54.602482
],
[
30.40913,
54.619732
],
[
30.591089,
54.642479
],
[
30.780769,
54.683159
],
[
31.06407,
54.689949
],
[
31.201559,
54.70348
],
[
31.37289,
54.738861
],
[
31.48156,
54.749538
],
[
31.63796,
54.814232
],
[
31.67371,
54.84396
],
[
32.004681,
54.86578
],
[
32.101212,
54.89006
],
[
32.147099,
54.9259
],
[
32.299351,
55.016338
],
[
32.344479,
55.029751
],
[
32.4063,
55.034019
],
[
32.504452,
55.056099
],
[
32.597309,
55.059959
],
[
32.674419,
55.078171
],
[
32.745689,
55.079319
],
[
33.19561,
55.132179
],
[
33.346119,
55.15284
],
[
33.471249,
55.183289
],
[
33.647659,
55.179359
],
[
33.89735,
55.1996
],
[
34.06139,
55.18755
],
[
34.237122,
55.22208
],
[
34.389042,
55.2654
],
[
34.562809,
55.32428
],
[
34.946049,
55.486511
],
[
34.976509,
55.49308
],
[
35.120701,
55.505718
],
[
35.398941,
55.491329
],
[
35.519581,
55.470581
],
[
35.61898,
55.46545
],
[
35.913269,
55.46558
],
[
36.064789,
55.457821
],
[
36.17548,
55.494419
],
[
36.455029,
55.54895
],
[
37.198662,
55.626869
],
[
37.29747,
55.6576
],
[
37.366482,
55.70998
],
[
37.53793,
55.73756
],
[
37.532028,
55.752178
],
[
37.538471,
55.76757
],
[
37.569962,
55.77998
]
]
}
Raw
stylesheet.css
body{
background-color:black;
}
.block{
display:inline-block;
}
.non_block{
display:block;
}
h1, a{
font-size:125%;
color:#fff;
}
textarea{
width:300px;
height:300px;
}
p{
color:#fff;
margin:5px;
}
.convert{
border-radius: 5px;
border: 2px solid #fff;
background-color: #999;
width: 100px;
text-align: center;
font-size:12px;
padding:3px;
}
.convert:hover{
background-color: #ddd;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment