使用Vue.js在地图中向下搜索

我正在尝试使用地图中的向下搜索（vue Highchart），但无法使其工作

像这样：

在Vue.js中有这样的例子吗？求你了

---

Tks.

这里是一个简单的向下钻取功能示例（带），它提供了Vue实例中的

向下钻取
和
向上钻取
事件：


Vue.use（VueHighcharts，{Highcharts:Highcharts}）；
//用于加载外部脚本的帮助器脚本
让loadScript=函数（url，onLoad）{
var scriptTag=document.createElement（'script'）；
scriptTag.src=url；
scriptTag.onload=onload；
scriptTag.onreadystatechange=onLoad；
document.body.appendChild（scriptTag）；
};
//简单图表选项
变量选项={
图表：{}，
标题：{
文本：“Highcharts Vue映射向下展开示例”
},
副标题:{
文本：“”，
浮动：是的，
对齐：“右”，
y:50，
风格：{
字体大小：“16px”
}
},
图例：{
布局：“垂直”，
对齐：“右”，
垂直排列：“中间”
},
颜色轴：{
分:0,，
minColor:“#E6E7E8”，
maxColor:“#005645”
},
地图导航：{
启用：对，
按钮选项：{
垂直排列：“底部”
}
},
打印选项：{
地图：{
国家：{
悬停：{
颜色：“#EEDD66”
}
}
}
},
向下展开：{
activeDataLabelStyle：{
颜色：“#FFFFFF”，
text装饰：“无”，
text大纲：“1px#000000”
},
钻孔按钮：{
relativeTo:'plotBox'，
职位：{
x:70，
y:280
}
}
},
系列：[{
数据：Highcharts.geojson（Highcharts.maps['countries/us/usall']）.map（（d，i）=>{
d、 向下钻取=真；
//例如，设置值
d、 值=i；
返回d；
}),
名称：'美国'，
数据标签：{
启用：对，
格式：“{point.properties.postal code}”
}
}]
};
让vm=新Vue({
el:“#应用程序”，
数据：{
孤岛加载：false，
选项：选项
},
创建（）{
//从Vue实例为图表准备事件
this.options.chart.events={
向下钻取：这个。向下钻取。绑定（这个），
钻取：这个。钻取。绑定（这个）
}
},
方法：{
向下钻取（e）{
设{chart}=this.$refs.highcharts；
如果（！e.系列选项）{
mapKey='countries/us/'+e.point.properties['hc-key']+'-all'；
if（Highcharts.maps[mapKey]）{
此.prepareDrilldownData（mapKey，e.point）；
返回；
}
this.isLoading=true；
加载脚本（'https://code.highcharts.com/mapdata/“+mapKey+”.js'，（）=>{
this.isLoading=false；
此.prepareDrilldownData（mapKey，e.point）；
});
}
setTitle（null，{text:e.point.name}）；
},
钻取（e）{
设{chart}=this.$refs.highcharts；
setTitle（null，{text:'}）；
},
prepareDrilldownData（地图键，点）{
设{chart}=this.$refs.highcharts；
data=Highcharts.geojson（Highcharts.maps[mapKey]）.map（（d，i）=>{
//例如，设置值
d、 值=i；
返回d；
});
图表.添加系列向下倾斜（点{
名称：point.name，
数据：数据，
数据标签：{
启用：对，
格式：“{point.name}”
}
});
}
}
});

加载。。。
您好，我尝试使用您的示例，但向我显示错误：未捕获类型错误：无法读取未定义的属性“countries/us/us all”。我将文件（'countries/us/us all'）导入到我的项目中，并像这样调用映射：import myMap from./map.js'我如何使用“import”代替数据：Highcharts.geojson（Highcharts.maps['countries/us/us all']）.map（（d，I）=>{…？@LindsayCarly你应该导入文件
import./map.js
（如果它是
countries/us/us all
实际上）并保持所有代码不变。这是我给你看的代码：@LindsayCarly好的，现在我明白了。是的，你应该添加
import myMap from./map.js'
并像
Highcharts.geojson（myMap）
I Max一样使用它。非常感谢你，我在你的帮助下解决了我的问题。再次感谢你！