本文主要是介绍Echarts实现行政区地图,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
一.效果图
二.代码实现
<template><div ref="chart" style="width: 100%; height: 500px;"></div>
</template><script setup>
import { ref, onMounted } from 'vue';
import axios from 'axios';
import * as echarts from 'echarts';const chart = ref(null);
const uploadedDataURL = "/src/components/map.json";const initChart = (geoJson) => {echarts.registerMap("china", geoJson);const geoCoordMap = {台湾: [121.5135, 25.0308],黑龙江: [127.9688, 45.368],内蒙古: [110.3467, 41.4899],吉林: [125.8154, 44.2584],北京市: [116.4551, 40.2539],辽宁: [123.1238, 42.1216],河北: [114.4995, 38.1006],天津: [117.4219, 39.4189],山西: [112.3352, 37.9413],陕西: [109.1162, 34.2004],甘肃: [103.5901, 36.3043],宁夏: [106.3586, 38.1775],青海: [101.4038, 36.8207],新疆: [87.9236, 43.5883],西藏: [91.11, 29.97],四川: [103.9526, 30.7617],重庆: [108.384366, 30.439702],山东: [117.1582, 36.8701],河南: [113.4668, 34.6234],江苏: [118.8062, 31.9208],安徽: [117.29, 32.0581],湖北: [114.3896, 30.6628],浙江: [119.5313, 29.8773],福建: [119.4543, 25.9222],江西: [116.0046, 28.6633],湖南: [113.0823, 28.2568],贵州: [106.6992, 26.7682],云南: [102.9199, 25.4663],广
这篇关于Echarts实现行政区地图的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!