带有 chartjs 的等值线图,给定一个 geojson 文件

问题描述 投票:0回答:0

我想使用 chartJS 制作澳大利亚各州的等值线图。数据是一个 geoJSON 文件。我不太确定如何使用 geoJSON 为图表设置数据结构。 (我不认为我们可以使用 topojson)。有谁知道如何处理这个问题?

这是框架 html.

<canvas id="location-geo"></canvas>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script>
  const url = "./aus_state.geojson";    
  fetch(url).then((result)=> result.json()).then((datapoint)=>{

    console.log(datapoint);
    //setup
    const data = {
    }

    const config = {
      type: 'choropleth',
      data: data,
      options:{
        scales:{
          y: {
            beginAtZero: true
          }
        }
      }
    }
    //render
    const myChart = new Chart(document.getElementById('location-geo'), config);  
  })
</script>

可以使用以下链接下载 geojson 文件:https://download2.exploratory.io/maps/aus_states.zip

我没有成功找到澳大利亚各州的 topojson 数据文件。如果有人可以提供此类资源,我愿意使用 topojson。只要我们使用 chartjs,我也对其他方法持开放态度。

javascript chart.js
© www.soinside.com 2019 - 2024. All rights reserved.