astrosat / windgl

A WebGL wind particle simulation as a Mapbox custom layer
https://astrosat.github.io/windgl/
ISC License
170 stars 45 forks source link

Unknown interpolation type zoom #33

Open FreeGIS opened 4 years ago

FreeGIS commented 4 years ago

`import 'mapbox-gl/dist/mapbox-gl.css'; var mapboxgl = require('mapbox-gl'); import {sampleFill, particles, source} from '@astrosat/windgl';

mapboxgl.accessToken = 'xxxxxxxx'; var map = new mapboxgl.Map({ container: 'map', style: 'mapbox://styles/mapbox/dark-v10' });

map.on("load", () => { const windSource = source("http://localhost:8080/windgl/wind/2019031012/tile.json"); map.addLayer(particles({ id: 'particles', source: windSource, // best to share the same source between all layers 'particle-speed': ['interpolate', ['zoom'], 0, 0.5, 10, 0.8] })); });`

err: windgl.umd.js:14097 Uncaught Error: Error: Unknown interpolation type zoom

FreeGIS commented 4 years ago

I changed the code from ['interpolate', ['zoom'], 0, 0.5, 10, 0.8] to ['interpolate', ['linear'],['zoom'], 0, 0.5, 10, 0.8] ,the error was disappeared,but no any results: image

owl1n commented 4 years ago

Did u fix it?

owl1n commented 4 years ago

@gampleman can u help? How i can fix same error with no data on map?

Robert-OP commented 3 years ago

Hi @FreeGIS and @owl1n - I managed to run the code by using this:

mapbox.addLayer(
          particles({
            id: 'particles',
            source: windSource,
            'particle-color': [
              'interpolate',
              ['linear'],
              ['get', 'speed'],
              0.0,
              '#3288bd',
              10,
              '#66c2a5',
              20,
              '#abdda4',
              30,
              '#e6f598',
              40,
              '#fee08b',
              50,
              '#fdae61',
              60,
              '#f46d43',
              100.0,
              '#d53e4f',
            ],
            'particle-speed': [
              'interpolate',
              ['linear'],
              ['zoom'],
              0,
              0.5,
              10,
              0.8,
            ],
          })
        );