Question

我正在尝试使用highcharts-chart指令在Highmaps中部署美国县地图。这在美国州地图上工作正常，但是在遇到编译错误时，在定义美国县的数据元素时遇到了问题。

这是尝试：

HTML

    <highcharts-chart 
        [Highcharts]="Highcharts"
        [constructorType]="'mapChart'"
        [options]="chartMap"
        [(update)]="updateFlag"
        [oneToOne]="true"
        style="width: 500px; height: 400px; display: block;"
    ></highcharts-chart>

打字稿

import * as Highcharts from 'highcharts';
import MapModule from 'highcharts/modules/map';
const mapX = require('@highcharts/map-collection/countries/us/us-all-all.geo.json')
MapModule(Highcharts);

.....
.....
this.chartMap = {
                chart: {
                    map: mapX
                },
                title: {
                    text: 'THIS IS THE US COUNTIES MAP'
                },
                series: [{ // <-- error is thrown here
                    name: 'Unemployment',
                    borderWidth: 0.5,
                    states: {
                        hover: {
                        color: 'red'
                        }
                    },
                    joinBy: ['hc-key', 'code'],
                    data:  [  
                        {
                            "code": "us-al-001",
                            "name": "Autauga County, AL",
                            "value": 3.9
                        },
                        {
                            "code": "us-al-003",
                            "name": "Baldwin County, AL",
                            "value": 4.3
                        }
                    ]
                    }]
            };

我收到以下编译错误：

键入'{name：string; borderWidth：数字；状态：{悬停：{颜色：串; }; }; joinBy：字符串[];数据：{“代码”：字符串； “名称”：串; “值”：数字； } []; }'无法分配给type 'SeriesAbandsOptions | SeriesAdOptions | SeriesAoOptions | SeriesApoOptions | SeriesAreaOptions | SeriesArearangeOptions | SeriesAreasplineOptions | SeriesAreasplinerangeOptions | ...另外82个 ... | SeriesZigzagOptions”。类型“ { 名称：字符串； borderWidth：数字；状态：{悬停：{颜色：字符串； }; }; joinBy：字符串[];数据：{“代码”：字符串； “ name”：字符串； “值”：数字； } []; }'，但必须输入 'SeriesXrangeOptions'.ts（2322）highcharts.d.ts（335083，5）：'类型'为在这里声明。

我以here的数据示例和here的地图示例为例。

此错误是什么以及如何解决？

Answer 1

发生此错误是因为您没有设置使用TypeScript时每个系列所必需的系列type。

series: [{
  name: 'Unemployment',
  type: 'map', // type is required for each series
  borderWidth: 0.5,
  states: {
    hover: {
      color: 'red'
    }
  },
  joinBy: ['hc-key', 'code'],
  data: [{
      "code": "us-al-001",
      "name": "Autauga County, AL",
      "value": 3.9
    },
    {
      "code": "us-al-003",
      "name": "Baldwin County, AL",
      "value": 4.3
    }
  ]
}]

有关此问题的更多信息：

Highmaps中的美国县地图因角度而引发编译错误

1 个答案: