反应：将geojson数据添加到deck.gl和react-map-gl

Question

我正在尝试在这里https://raw.githubusercontent.com/pennytalalak/road-crash-data/master/src/data/output.geojson绘制一个非常简单的数据

但是它不会在地图上显示数据。不确定是我的geojson文件还是我的控制台中所说的代码

这是我的代码：

import React, { Component } from "react";
import { StaticMap } from "react-map-gl";
import DeckGL, { GeoJsonLayer } from "deck.gl";

//Mapbox Token
const MAPBOX_TOKEN =
  "###########################";

//Geojson Data URL
const DATA =
  "https://raw.githubusercontent.com/pennytalalak/road-crash-data/master/src/data/output.geojson";

const LIGHT_SETTINGS = {
  lightsPosition: [-125, 50.5, 5000, -122.8, 48.5, 8000],
  ambientRatio: 0.2,
  diffuseRatio: 0.5,
  specularRatio: 0.3,
  lightsStrength: [2.0, 0.0, 1.0, 0.0],
  numberOfLights: 2
};

const INITIAL_VIEW_STATE = {
  latitude: -35.280937,
  longitude: 149.130005,
  zoom: 13,
  pitch: 0,
  bearing: 0
};

export default class Map extends Component {
  renderLayer() {
    const { data = DATA } = this.props;

    return [
      new GeoJsonLayer({
        id: "geoJson",
        data,
        filled: true,
        lightSettings: LIGHT_SETTINGS
      })
    ];
  }

  render() {
    const { viewState, baseMap = true } = this.props;

    return (
      <DeckGL
        layers={this.renderLayer()}
        initialViewState={INITIAL_VIEW_STATE}
        viewState={viewState}
        controller={true}
      >
        {baseMap && (
          <StaticMap
            mapStyle="mapbox://styles/mapbox/dark-v9"
            preventStyleDiffing={true}
            mapboxApiAccessToken={MAPBOX_TOKEN}
          />
        )}
      </DeckGL>
    );
  }
}