plunkerでdeck.gl

#概要

plunkerでdeck.glやってみた。
思えば、plunkerで、deck.glしたいだけの一年だった。
mapboxは、使わん。

#写真

#サンプルコード

const tileLayer = new deck.TileLayer({
	data: 'https://c.tile.openstreetmap.org/{z}/{x}/{y}.png',
	minZoom: 0,
	maxZoom: 19,
	tileSize: 256,
	renderSubLayers: props => {
		const {
			bbox: {
        west, 
        south, 
        east, 
        north
      }
		} = props.tile;
		return new deck.BitmapLayer(props, {
			data: null,
			image: props.data,
			bounds: [west, south, east, north]
		});
	}
});

const deckgl = new deck.DeckGL({
  initialViewState: {
    latitude: 38.0,
    longitude: 140.0,
    zoom: 7,
    maxZoom: 16,
    pitch: 80,
    bearing: -15
  },
  controller: true,
 	layers: [tileLayer],
});

#成果物

以上。