Skip to content

Commit 09343ae

Browse files
antoinergantoinerg
committed
mapbox: add shortcuts to additional non-Mapbbox tilesets
1 parent a54b8a3 commit 09343ae

8 files changed

+226
-21
lines changed

‎src/plots/mapbox/constants.js

+128-19
Original file line numberDiff line numberDiff line change
@@ -20,27 +20,136 @@ module.exports = {
2020
styleValueOSM: 'open-street-map',
2121
styleValueDflt: 'basic',
2222

23-
styleOSM: {
24-
id: 'osm',
25-
version: 8,
26-
sources: {
27-
'plotly-osm-tiles': {
23+
styles: {
24+
'open-street-map': {
25+
id: 'osm',
26+
version: 8,
27+
sources: {
28+
'plotly-osm-tiles': {
29+
type: 'raster',
30+
attribution: '<a href="http://www.openstreetmap.org/about/" target="_blank">© OpenStreetMap</a>',
31+
tiles: [
32+
'https://a.tile.openstreetmap.org/{z}/{x}/{y}.png',
33+
'https://b.tile.openstreetmap.org/{z}/{x}/{y}.png'
34+
],
35+
tileSize: 256
36+
}
37+
},
38+
layers: [{
39+
id: 'plotly-osm-tiles',
2840
type: 'raster',
29-
attribution: '<a href="http://www.openstreetmap.org/about/" target="_blank">© OpenStreetMap</a>',
30-
tiles: [
31-
'https://a.tile.openstreetmap.org/{z}/{x}/{y}.png',
32-
'https://b.tile.openstreetmap.org/{z}/{x}/{y}.png'
33-
],
34-
tileSize: 256
35-
}
41+
source: 'plotly-osm-tiles',
42+
minzoom: 0,
43+
maxzoom: 22
44+
}]
3645
},
37-
layers: [{
38-
id: 'plotly-osm-tiles',
39-
type: 'raster',
40-
source: 'plotly-osm-tiles',
41-
minzoom: 0,
42-
maxzoom: 22
43-
}]
46+
'white-bg': {
47+
id: 'white-bg',
48+
version: 8,
49+
sources: {},
50+
layers: [{
51+
id: 'white-bg',
52+
type: 'background',
53+
paint: {'background-color': '#FFFFFF'},
54+
minzoom: 0,
55+
maxzoom: 22
56+
}]
57+
},
58+
cartodb: {
59+
id: 'cartodb-positron',
60+
version: 8,
61+
sources: {
62+
'plotly-cartodb-positron': {
63+
type: 'raster',
64+
attribution: '<a href="https://carto.com/" target="_blank">© CARTO</a>',
65+
tiles: ['https://cartodb-basemaps-c.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png'],
66+
tileSize: 256
67+
}
68+
},
69+
layers: [{
70+
id: 'plotly-cartodb-positron',
71+
type: 'raster',
72+
source: 'plotly-cartodb-positron',
73+
minzoom: 0,
74+
maxzoom: 22
75+
}]
76+
},
77+
'cartodb-dark': {
78+
id: 'cartodb-dark',
79+
version: 8,
80+
sources: {
81+
'plotly-cartodb-dark': {
82+
type: 'raster',
83+
attribution: '<a href="https://carto.com/" target="_blank">© CARTO</a>',
84+
tiles: ['https://cartodb-basemaps-c.global.ssl.fastly.net/dark_all/{z}/{x}/{y}.png'],
85+
tileSize: 256
86+
}
87+
},
88+
layers: [{
89+
id: 'plotly-cartodb-dark',
90+
type: 'raster',
91+
source: 'plotly-cartodb-dark',
92+
minzoom: 0,
93+
maxzoom: 22
94+
}]
95+
},
96+
'stamen-terrain': {
97+
id: 'stamen-terrain',
98+
version: 8,
99+
sources: {
100+
'plotly-stamen-terrain': {
101+
type: 'raster',
102+
attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, under <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> | Data by <a href="http://openstreetmap.org">OpenStreetMap</a>, under <a href="http://www.openstreetmap.org/copyright">ODbL</a>.',
103+
tiles: ['https://stamen-tiles.a.ssl.fastly.net/terrain/{z}/{x}/{y}.png'],
104+
tileSize: 256
105+
}
106+
},
107+
layers: [{
108+
id: 'plotly-stamen-terrain',
109+
type: 'raster',
110+
source: 'plotly-stamen-terrain',
111+
minzoom: 0,
112+
maxzoom: 22
113+
}]
114+
},
115+
'stamen-toner': {
116+
id: 'stamen-toner',
117+
version: 8,
118+
sources: {
119+
'plotly-stamen-toner': {
120+
type: 'raster',
121+
attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, under <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> | Data by <a href="http://openstreetmap.org">OpenStreetMap</a>, under <a href="http://www.openstreetmap.org/copyright">ODbL</a>.',
122+
tiles: ['https://stamen-tiles.a.ssl.fastly.net/toner/{z}/{x}/{y}.png'],
123+
tileSize: 256
124+
}
125+
},
126+
layers: [{
127+
id: 'plotly-stamen-toner',
128+
type: 'raster',
129+
source: 'plotly-stamen-toner',
130+
minzoom: 0,
131+
maxzoom: 22
132+
}]
133+
},
134+
'stamen-watercolor': {
135+
id: 'stamen-watercolor',
136+
version: 8,
137+
sources: {
138+
'plotly-stamen-watercolor': {
139+
type: 'raster',
140+
attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, under <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> | Data by <a href="http://openstreetmap.org">OpenStreetMap</a>, under <a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY SA</a>.',
141+
tiles: ['https://stamen-tiles.a.ssl.fastly.net/watercolor/{z}/{x}/{y}.png'],
142+
tileSize: 256
143+
}
144+
},
145+
layers: [{
146+
id: 'plotly-stamen-watercolor',
147+
type: 'raster',
148+
source: 'plotly-stamen-watercolor',
149+
minzoom: 0,
150+
maxzoom: 22
151+
}]
152+
}
44153
},
45154

46155
controlContainerClassName: 'mapboxgl-control-container',

‎src/plots/mapbox/mapbox.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -647,8 +647,8 @@ function getStyleObj(val) {
647647

648648
if(constants.styleValuesMapbox.indexOf(val) !== -1) {
649649
styleObj.style = convertStyleVal(val);
650-
} else if(val === constants.styleValueOSM) {
651-
styleObj.style = constants.styleOSM;
650+
} else if(constants.styles[val]) {
651+
styleObj.style = constants.styles[val];
652652
} else {
653653
styleObj.style = val;
654654
}

‎test/image/baselines/mapbox_cartodb-style.png

70.5 KB
Loading

‎test/image/baselines/mapbox_stamen-style.png

196 KB
Loading

‎test/image/baselines/mapbox_white-bg-style.png

1.73 KB
Loading

‎test/image/mocks/mapbox_cartodb-style.json

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"data": [
3+
{
4+
"type": "scattermapbox",
5+
"name": "cartodb",
6+
"lon": [ 10, 20 ],
7+
"lat": [ 20, 10 ]
8+
},
9+
{
10+
"type": "scattermapbox",
11+
"name": "cartodb-dark",
12+
"lon": [ 10, 20 ],
13+
"lat": [ 20, 10 ],
14+
"subplot": "mapbox2"
15+
}
16+
],
17+
"layout": {
18+
"grid": {"rows": 1, "columns": 2},
19+
20+
"legend": {
21+
"x": 0,
22+
"y": 1, "yanchor": "bottom"
23+
},
24+
25+
"mapbox": {
26+
"domain": {"row": 0, "column": 0},
27+
"style": "cartodb"
28+
},
29+
"mapbox2": {
30+
"domain": {"row": 0, "column": 1},
31+
"style": "cartodb-dark"
32+
}
33+
}
34+
}

‎test/image/mocks/mapbox_stamen-style.json

+44
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
{
2+
"data": [
3+
{
4+
"type": "scattermapbox",
5+
"name": "stamen-terrain",
6+
"lon": [ 10, 20 ],
7+
"lat": [ 20, 10 ]
8+
},
9+
{
10+
"type": "scattermapbox",
11+
"name": "stamen-toner",
12+
"lon": [ 10, 20 ],
13+
"lat": [ 20, 10 ],
14+
"subplot": "mapbox2"
15+
},
16+
{
17+
"type": "scattermapbox",
18+
"name": "stamen-watercolor",
19+
"lon": [ 10, 20 ],
20+
"lat": [ 20, 10 ],
21+
"subplot": "mapbox3"
22+
}
23+
],
24+
"layout": {
25+
"grid": {"rows": 1, "columns": 3},
26+
27+
"legend": {
28+
"x": 0,
29+
"y": 1, "yanchor": "bottom"
30+
},
31+
"mapbox": {
32+
"domain": {"row": 0, "column": 0},
33+
"style": "stamen-terrain"
34+
},
35+
"mapbox2": {
36+
"domain": {"row": 0, "column": 1},
37+
"style": "stamen-toner"
38+
},
39+
"mapbox3": {
40+
"domain": {"row": 0, "column": 2},
41+
"style": "stamen-watercolor"
42+
}
43+
}
44+
}

‎test/image/mocks/mapbox_white-bg-style.json

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"data": [
3+
{
4+
"type": "scattermapbox",
5+
"name": "white-bg",
6+
"lon": [ 10, 20 ],
7+
"lat": [ 20, 10 ]
8+
}
9+
],
10+
"layout": {
11+
"width": 200,
12+
"height": 200,
13+
"margin": {"t": 0, "b": 0, "l": 0, "r": 0},
14+
"mapbox": {
15+
"style": "white-bg"
16+
}
17+
}
18+
}

0 commit comments

Comments
 (0)