demo for dprs

demo/demo.js

@@ -12,23 +12,20 @@ const mapboxEnabled = false
 // otherwise the demo page will run out of credits and that would be very sad :(
 const MAPBOX_ACCESS_TOKEN = 'pk.eyJ1IjoicGlnZW9uLW1hcHMiLCJhIjoiY2l3eW01Y2E2MDA4dzJ6cWh5dG9pYWlwdiJ9.cvdCf-7PymM1Y3xp5j71NQ'
 
-const mapbox = (mapboxId, accessToken) => (x, y, z) => {
-  const retina = typeof window !== 'undefined' && window.devicePixelRatio >= 2 ? '@2x' : ''
-  return `https://api.mapbox.com/styles/v1/mapbox/${mapboxId}/tiles/256/${z}/${x}/${y}${retina}?access_token=${accessToken}`
+const mapbox = (mapboxId, accessToken) => (x, y, z, dpr) => {
+  return `https://api.mapbox.com/styles/v1/mapbox/${mapboxId}/tiles/256/${z}/${x}/${y}${dpr >= 2 ? '@2x' : ''}?access_token=${accessToken}`
 }
 
 const providers = {
   osm: (x, y, z) => {
     const s = String.fromCharCode(97 + (x + y + z) % 3)
     return `https://${s}.tile.openstreetmap.org/${z}/${x}/${y}.png`
   },
-  wikimedia: (x, y, z) => {
-    const retina = typeof window !== 'undefined' && window.devicePixelRatio >= 2 ? '@2x' : ''
-    return `https://maps.wikimedia.org/osm-intl/${z}/${x}/${y}${retina}.png`
+  wikimedia: (x, y, z, dpr) => {
+    return `https://maps.wikimedia.org/osm-intl/${z}/${x}/${y}${dpr >= 2 ? '@2x' : ''}.png`
   },
-  stamen: (x, y, z) => {
-    const retina = typeof window !== 'undefined' && window.devicePixelRatio >= 2 ? '@2x' : ''
-    return `https://stamen-tiles.a.ssl.fastly.net/terrain/${z}/${x}/${y}${retina}.jpg`
+  stamen: (x, y, z, dpr) => {
+    return `https://stamen-tiles.a.ssl.fastly.net/terrain/${z}/${x}/${y}${dpr >= 2 ? '@2x' : ''}.jpg`
   },
   streets: mapbox('streets-v10', MAPBOX_ACCESS_TOKEN),
   satellite: mapbox('satellite-streets-v10', MAPBOX_ACCESS_TOKEN),
@@ -146,6 +143,7 @@ export default class App extends Component {
             center={center}
             zoom={zoom}
             provider={providers[provider]}
+            dprs={[1, 2]}
             onBoundsChanged={this.handleBoundsChange}
             onClick={this.handleClick}
             onAnimationStart={this.handleAnimationStart}