在vue项目中实现:
1.安装echarts
npm i echarts
2.使用echarts,这里需要中国地图的json数据,可以自行查找(或者私我)。
// echarts5版本,引入echarts的方式发生了改变,要使用以下方式引入
import * as echart from "echarts"
import {ref,onMounted} from "vue"
// 引入中国地图的json数据
import CHINA from "./assets/china.json";
let container=ref()
onMounted(() => {
let myChart = echarts.init(container.value);
// 注册地图
echarts.registerMap("china", CHINA as any);
myChart.setOption({
geo: [
{
show: true,
map: "china",
roam: true,
label: {
show:
Vue项目中实现ECharts中国地图及线路可视化,

本文介绍了如何在Vue项目中安装并使用ECharts库,包括引入地图数据、设置地图样式以及添加路线数据,以实现中国地图的动态展示和线路的可视化效果。
最低0.47元/天 解锁文章
4880






