Deck.GL ScatterplotLayer не отображает очки - PullRequest
Новая
       43

Deck.GL ScatterplotLayer не отображает очки

0 голосов
/ 28 сентября 2018

Я слишком долго чесал голову над этим.У меня есть самое простое приложение React, которое передает некоторые данные в качестве опоры в WhwhatMap (так называемый, потому что я пробовал много разных библиотек карт).

Однако, когда я пытаюсь построить данныеточки на Deck.GL с использованием ScatterplotLayer, я просто не вижу их на отрисованной карте.

Согласно React Developer Tools, компонент ScatterplotLayer получил мои точки данных.

Я ожидаючтобы увидеть некоторые маркеры вдоль определенной части железнодорожных путей в Берлине.

1 Ответ

0 голосов
/ 29 сентября 2018

Во-первых, ответ.Ваш код кажется правильным, однако некоторая подстройка, похоже, устраняет ошибку. 

const plot_position_layer = new ScatterplotLayer({
  id: 'scatterplot-layer',
  data,
  pickable: true,
  opacity: 0.8,
  radiusScale: 30,  // make the dots visible or darker background
  radiusMinPixels: 15, // make the dots visible or darker background
  radiusMaxPixels: 100,

  getPosition: d => [d.coordinates[1], d.coordinates[0]], // -> Essential Change here

  getColor: d => [255, 255, 255], // make the dots visible or darker background
})

Теперь, по сути, изменилось: getPosition: d => [d.coordinates[1], d.coordinates[0]]

Странно,Ожидается, что функция getPosition будет возвращать массив с первым элементом в качестве долготы вместо широты, поэтому точки выходят за границы.

enter image description here

Имеютпосмотрите на их пример здесь в строке № 11. 

// Source data CSV
const DATA_URL =
  'https://raw.githubusercontent.com/uber-common/deck.gl-data/master/examples/scatterplot/manhattan.json'; // eslint-disable-line

export const INITIAL_VIEW_STATE = {
  longitude: -74, //remember, longitude starts with 74
  latitude: 40.7,
  zoom: 11,
  maxZoom: 16,
  pitch: 0,
  bearing: 0
};

и DATA_URL читается как 

[
  [-73.986022,40.730743,2], // the first element is longitude
  [-73.984293,40.729468,1],
  [-73.987752,40.732017,1],
  [-73.986887,40.730105,2],
  ...
]

Надеюсь, это поможет

...