Skip to content

Commit 4b11bf1

Browse files
purvasingh96purvasingh96
committed
first commit
0 parents  commit 4b11bf1

13 files changed

+42804
-0
lines changed

‎.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/node_modules

‎README.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
# Example: GeoJSON
2+
3+
This example showcases how to dynamically add and update custom data sources.
4+
5+
## Usage
6+
7+
To run this example, you need a [Mapbox token](http://visgl.github.io/react-map-gl/docs/get-started/mapbox-tokens). You can either set it as `MAPBOX_TOKEN` in `src/app.js`, or set a `MapboxAccessToken` environment variable in the command line.
8+
9+
```bash
10+
npm i
11+
npm run start
12+
```

‎index.html

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset='UTF-8' />
5+
<title>Accessible Maps</title>
6+
<link href="https://api.mapbox.com/mapbox-gl-js/v2.6.1/mapbox-gl.css" rel="stylesheet">
7+
<style>
8+
body {
9+
margin: 0;
10+
font-family: Helvetica, Arial, sans-serif;
11+
}
12+
#map {
13+
width: 100vw;
14+
height: 100vh;
15+
}
16+
.control-panel {
17+
position: absolute;
18+
top: 0;
19+
right: 0;
20+
max-width: 320px;
21+
background: #fff;
22+
box-shadow: 0 2px 4px rgba(0,0,0,0.3);
23+
padding: 12px 24px;
24+
margin: 20px;
25+
font-size: 13px;
26+
line-height: 2;
27+
color: #6b6b76;
28+
text-transform: uppercase;
29+
outline: none;
30+
}
31+
32+
label {
33+
display: inline-block;
34+
width: 100px;
35+
}
36+
37+
input {
38+
margin-left: 20px;
39+
width: 160px;
40+
}
41+
42+
.tooltip {
43+
position: absolute;
44+
margin: 8px;
45+
padding: 4px;
46+
background: rgba(0, 0, 0, 0.8);
47+
color: #fff;
48+
max-width: 300px;
49+
font-size: 10px;
50+
z-index: 9;
51+
pointer-events: none;
52+
}
53+
54+
</style>
55+
</head>
56+
<body>
57+
<div id="map"></div>
58+
<script src='app.js'></script>
59+
</body>
60+
<script type="text/javascript">
61+
App.renderToDom(document.getElementById('map'));
62+
</script>
63+
</html>

0 commit comments

Comments
 (0)