Vue 中使用highmaps 无法加载地图的问题？

[orangle]

直接下载地图通过import导入总是报错

Can't read property 'custom/world-continents' of undefined, using Highcharts.maps['custom/world-continents']

或者是 Highcharts not defined

地图引入 以及 案例 https://gist.github.com/oysteinmoseng/99808bc853faa80294c3066e4da951cb

麻烦的就是js地图数据es6不能直接引用 需要使用 module.exports = 来替换之前的属性写法

[orangle]

gist被Q了，copy过来一份

例如 au-all.js 修改下开头的部分

module.exports = {"title":"Australia","version":"1.1.2"

使用的例子

import Highcharts from 'highcharts/highstock.src';
import mapFactory from 'highcharts/modules/map.src';
import australiaMap from './au-all.js'

mapFactory(Highcharts);

var data = [
     {
         "hc-key": "au-nt",
         "value": 0
     },
     {
         "hc-key": "au-wa",
         "value": 1
     },
     {
         "hc-key": "au-ct",
         "value": 2
     },
     {
         "hc-key": "au-sa",
         "value": 3
     },
     {
         "hc-key": "au-ql",
         "value": 4
     },
     {
         "hc-key": "au-2557",
         "value": 5
     },
     {
         "hc-key": "au-ts",
         "value": 6
     },
     {
         "hc-key": "au-jb",
         "value": 7
     },
     {
         "hc-key": "au-ns",
         "value": 8
     },
     {
         "hc-key": "au-vi",
         "value": 9
     }
 ];

var chart = Highcharts.mapChart('container', {
     title : {
         text : 'Highmaps node demo'
     },

     subtitle : {
         text : 'Source map: <a href="https://code.highcharts.com/mapdata/countries/au/au-all.js">Australia</a>'
     },

     colorAxis: {
         min: 0
     },

     series : [{
         data : data,
         mapData: australiaMap,
         joinBy: 'hc-key',
         name: 'Random data',
         dataLabels: {
             enabled: true,
             format: '{point.name}'
         }
     }]
});