-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathindex.html
95 lines (90 loc) · 5.08 KB
/
index.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
<!DOCTYPE html>
<html>
<head>
<title>MapBox viewer examples</title>
<style>
body {
font: 15px/20px 'Open Sans', sans-serif;
}
</style>
</head>
<body>
This page is largely based on <a target="mapboxexamples" href="https://www.mapbox.com/mapbox-gl-js/examples/">https://www.mapbox.com/mapbox-gl-js/examples/</a><br> mapbox-gl is an open source project backed by a large community. The examples on this page show that mapbox-gl can also
be used independently of the MapBox services (no built-in MapBox vendor lock-in).
<h2>Mapbox vs OpenLayers</h2>
MapBox supports only one projection, spherical Mercator or pseudo Mercator (EPSG:3857) which is the de-facto standard for
maps on the web. OpenLayers supports many. OpenLayers has better support for OGC standards such as WMS and WFS. MapBox
has better support for vector tiles and fast rendering using webgl. OpenLayers has a broader and more complete feature
set. MapBox takes advantage of newer technologies
<h2>Styles</h2>
<ul>
<li><a href="displaymap.html">Display a map</a></li>
<li><a href="displaymapcustomstyle.html">Display a map with a custom style</a></li>
<li><a href="setstyle.html">Change a map's style</a></li>
<li><a href="aerial.html">Display aerial map</a> with scale bar. Todo: find global layer</li>
<li><a href="gebouwkenmerken.html">3D style (2.5 D, extrusion)</a></li>
<li><a href="aerial2.html">3D with aerial </a></li>
<li><a href="geotop.html">GeoTop ondergrond 3D</a></li>
</ul>
<h2>Layers</h2>
<ul>
<li><a href="toggle-layers.html">Show and hide layers</a></li>
<li><a href="cluster.html">Create and style clusters</a></li>
<li><a href="heatmap.html">Create a heatmap from points</a></li>
<li><a href="colorswitcher.html">Change a layer's color with buttons</a></li>
<li><a href="geojson-layer-in-stack.html">Add a new layer in between other layers and below labels</a></li>
<li>Add a GeoJSON line</li>
<li>Add a GeoJSON polygon</li>
<li>Add multiple geometries from one GeoJSON source</li>
<li><a href="geojson-markers.html">Draw GeoJSON points</a> using icons from base layer sprite</li>
<li><a href="add-image.html">Draw GeoJSON points</a> using a custom icon image</li>
<li>Style circles using data-driven styling</li>
<li>Update a choropleth layer by zoom level</li>
<li>Adjust a layer's opacity</li>
<li>Extrude polygons for 3D indoor mapping.</li>
<li>Display buildings in 3D</li>
<li>Style lines using an identity property function.</li>
</ul>
<h2>Sources</h2>
<ul>
<li><a href="vector-source.html">Add a vector tile source (geoserver)</a></li>
<li><a href="vector-source2.html">Add a vector tile source (postgis mvt)</a></li>
<li><a href="rail-mvt.html">Add custom osm vector tile source (postgis mvt)</a></li>
<li><a href="openstreetmap.html">Add a raster tile source</a></li>
<li>Add a WMS source</li>
<li>Add live realtime data</li>
<li>Update a feature in realtime</li>
<li>Animate a point</li>
<li>Animate a series of images</li>
<li>Create a time slider</li>
<li>Join local JSON data with vector tile geometries</li>
<li><a href="cbs.html">Join local csv data with vector tile geometries</a></li>
<li><a href="cbs_gsheets.html">Join google sheet data with vector tile geometries</a></li>
<li><a href="point_gsheets.html">Load point data from google sheet</a></li>
</ul>
<h2>User Interaction</h2>
<ul>
<li>Display a non-interactive map</li>
<li>Change a map's style</li>
<li>Change a map's language</li>
<li>Center the map on a clicked symbol</li>
<li>Change a layer's color with buttons</li>
<li>Create a hover effect</li>
<li>Get coordinates of the mouse pointer</li>
<li><a href="vector-source3.html">Get features under the mouse pointer</a></li>
</ul>
<h2>External libraries</h2>
<li><a href="cbsgrid.html">Handsontable</a>: combine map with spreadsheet-like data view</li>
<li><a href="agnadressen.html">Turf</a>: union polygons from tiles, calculate buffer</li>
<li><a href="mapbox-distance.html">Turf</a>: distance along the curvature of the earth</li>
<li><a href="voronoi_gsheet.html">Voronoi</a>: create voronoi from google sheet points</li>
<li><a href="adamov.html">Amsterdam realtime traffic & public transport</a>: trafficlayer.js</li>
<h2>Experiments</h2>
<li><a href="geojson.html">Large Geojson</a>: load 17MB GeoJSON file</li>
<li><a href="d3js.html">Combine with d3js</a>: show d3.js svg on top of mapbox map</li>
<li><a href="mapboxwms.html">Use WMS and WMTS server</a>, including getFeatureInfo and getLegendGraphic </li>
<li><a href="rijksdriehoek.html">Trying non-mercator projections</a></li>
<li><a href="fillpattern.html">Dynamically loaded fill-patterns</a></li>
<li><a href="boomregister.html">Tree editor</a> change height or cut any tree in the Netherlands</li>
</body>
</html>