1

我一直在尝试使用 API 中的 <Chart />反应组件react-google-charts,但是,我似乎无法让标记显示在地图上。

我注意到,即使是React Google Charts站点上的 Marker GeoCharts 示例也没有功能标记。

这是该网站的代码片段:

<Chart
  width={'500px'}
  height={'300px'}
  chartType="GeoChart"
  data={[
    ['City', 'Population', 'Area'],
    ['Rome', 2761477, 1285.31],
    ['Milan', 1324110, 181.76],
    ['Naples', 959574, 117.27],
  ]}
  options={{
    region: 'IT',
    displayMode: 'markers',
    colorAxis: { colors: ['green', 'blue'] },
  }}
  // Note: you will need to get a mapsApiKey for your project.
  // See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
  mapsApiKey="YOUR_KEY_HERE"
  rootProps={{ 'data-testid': '2' }}
/>

这是输出的屏幕截图: 标记 GeoChart 输出(意大利)

我还生成了自己的 API 密钥,并且我还尝试在 Chart 组件中使用“columns”道具。我似乎仍然无法让标记工作。

即使您不知道如何解决此错误,如果您对可以与 react 一起使用的交互式地图有任何建议(并且我可以添加交互式标记),请告诉我!

4

1 回答 1

0

您必须启用 Geolocation API 和 Geocoding API 才能使标记工作。

于 2020-10-21T08:41:51.337 回答