首页 > 其他分享 >echarts绘制世界地图的时候显示南海诸岛的局部放大图

echarts绘制世界地图的时候显示南海诸岛的局部放大图

时间:2024-02-20 15:57:29浏览次数:25  
标签:25 echarts 世界地图 南海诸岛 126 131.04761904761904 24.75 127.23809523809524

ehcarts在绘制中国地图的时候,判断geo的map为china的时候会自动加上南海诸岛的局部放大图。

产品想在绘制世界地图的时候也加上南海诸岛,搞了半天没搞定,请教的同事搞定了。同事在此:简书ID:昊桐_260c。

解决办法就是把南海诸岛的地图数据直接放在注册的JSON里面。

{             "geometry": {                 "type": "MultiPolygon",                 "coordinates": [                     [                         [                             [                                 126,                                 24.75                             ],                             [                                 126.66666666666667,                                 24.2                             ],                             [                                 127.42857142857143,                                 24.15                             ],                             [                                 128.85714285714286,                                 24.5                             ],                             [                                 130,                                 24.95                             ],                             [                                 130.95238095238096,                                 24.95                             ],                             [                                 131.33333333333334,                                 24.45                             ],                             [                                 131.61904761904762,                                 24.95                             ],                             [                                 132.0952380952381,                                 24.95                             ],                             [                                 132.0952380952381,                                 25                             ],                             [                                 126.47619047619048,                                 25                             ],                             [                                 126,                                 24.75                             ]                         ],                         [                             [                                 127.23809523809524,                                 23.85                             ],                             [                                 127.80952380952381,                                 23.95                             ],                             [                                 127.52380952380952,                                 23.45                             ],                             [                                 127.04761904761905,                                 23.35                             ],                             [                                 127.23809523809524,                                 23.85                             ]                         ],                         [                             [                                 127.14285714285714,                                 22.7                             ],                             [                                 127.33333333333333,                                 22.25                             ],                             [                                 127.42857142857143,                                 22.25                             ],                             [                                 127.23809523809524,                                 22.7                             ],                             [                                 127.14285714285714,                                 22.7                             ]                         ],                         [                             [                                 127.52380952380952,                                 21.6                             ],                             [                                 127.14285714285714,                                 21.2                             ],                             [                                 127.23809523809524,                                 21.2                             ],                             [                                 127.71428571428571,                                 21.6                             ],                             [                                 127.52380952380952,                                 21.6                             ]                         ],                         [                             [                                 126.57142857142857,                                 20.4                             ],                             [                                 126.76190476190476,                                 20                             ],                             [                                 126.85714285714286,                                 20                             ],                             [                                 126.76190476190476,                                 20.4                             ],                             [                                 126.57142857142857,                                 20.4                             ]                         ],                         [                             [                                 128.1904761904762,                                 19.1                             ],                             [                                 128.76190476190476,                                 19.3                             ],                             [                                 128.85714285714286,                                 19.3                             ],                             [                                 128.38095238095238,                                 19.1                             ],                             [                                 128.1904761904762,                                 19.1                             ]                         ],                         [                             [                                 129.52380952380952,                                 19.95                             ],                             [                                 130.0952380952381,                                 20.55                             ],                             [                                 130.1904761904762,                                 20.55                             ],                             [                                 129.71428571428572,                                 19.95                             ],                             [                                 129.52380952380952,                                 19.95                             ]                         ],                         [                             [                                 130.57142857142858,                                 21.35                             ],                             [                                 130.85714285714286,                                 21.75                             ],                             [                                 131.04761904761904,                                 21.75                             ],                             [                                 130.76190476190476,                                 21.35                             ],                             [                                 130.57142857142858,                                 21.35                             ]                         ],                         [                             [                                 130.85714285714286,                                 22.5                             ],                             [                                 130.85714285714286,                                 22.95                             ],                             [                                 131.04761904761904,                                 22.95                             ],                             [                                 131.04761904761904,                                 22.5                             ],                             [                                 130.85714285714286,                                 22.5                             ]                         ],                         [                             [                                 130.95238095238096,                                 23.4                             ],                             [                                 131.23809523809524,                                 23.75                             ],                             [                                 131.33333333333334,                                 23.75                             ],                             [                                 131.04761904761904,                                 23.4                             ],                             [                                 130.95238095238096,                                 23.4                             ]                         ],                         [                             [                                 131.52380952380952,                                 24.1                             ],                             [                                 131.9047619047619,                                 24.5                             ],                             [                                 132,                                 24.5                             ],                             [                                 131.71428571428572,                                 24.1                             ],                             [                                 131.52380952380952,                                 24.1                             ]                         ],                         [                             [                                 126,                                 24.75                             ],                             [                                 126,                                 18.35                             ],                             [                                 132.0952380952381,                                 18.35                             ],                             [                                 132.0952380952381,                                 25                             ],                             [                                 132,                                 25                             ],                             [                                 132,                                 18.4                             ],                             [                                 126.0952380952381,                                 18.4                             ],                             [                                 126.0952380952381,                                 24.75                             ],                             [                                 126,                                 24.75                             ]                         ]                     ]                 ]             },             "properties": {                 "name": "南海诸岛",                 "childNum": 1             }         }

标签:25,echarts,世界地图,南海诸岛,126,131.04761904761904,24.75,127.23809523809524
From: https://www.cnblogs.com/junlinglife/p/18023283

相关文章

  • 使用Echarts绘图
    案例1参考代码如下<!-- 此示例下载自https://echarts.apache.org/examples/zh/editor.html?c=bar-histogram--><!DOCTYPEhtml><htmllang="en"style="height:100%"><head><metacharset="utf-8"></head&g......
  • echarts自适应问题,echarts中怎么改变字体单位实现自适应
    参考文档:https://blog.csdn.net/MFWSCQ/article/details/102522944最初想着怎么给echarts设置vw单位或者rem,echart中怎么把legend的单位设置为vw或者rem来使表格自适应,后面发现行不通。项目中使用px-to-vw包,将所有px转为对应的vw,所有可以根据相同比例进行缩放,做到自适应效果。但......
  • v-if后的echarts显示已有dom解决方法
    控制台报错:Thereisachartinstancealreadyinitializedonthedom. 核心思路:先判断dom是否存在,如存在就调用销毁方法,再初始化正常操作。echarts内:if(this.myChart!=null&&this.myChart!=""&&this.myChart!=undefined......
  • vue3整合echarts
    Vue3是一个流行的前端框架,而ECharts是一个功能强大的图表库。将ECharts整合到Vue3项目中可以方便地展示各种图表。以下是将ECharts整合到Vue3项目中的基本步骤:安装ECharts:使用npm或yarn安装ECharts:bash复制代码npminstallecharts--save或......
  • Vue中使用Echarts
    第一步:安装echarts模块cnpminstallecharts-S第二步:在main.js中全局引入importechartsfrom'echarts'Vue.prototype.$echarts=echarts//全局引入后面用this.$echarts就能直接使用了使用方式:template中<template><el-cardclass="box-card"style=&quo......
  • echarts饼状图点击选择功能
    我们在使用echarts的时候,不免会遇到点击饼状图进而让其他地方数据发生变化的功能,这时候我们就需要将当前点击的饼状图区域放大显示(选中状态)。1.vue<divref="csRef"></div>2.方法constcsRef=ref()letmychart=""constchartIndex=ref()//渲染constrenderFun=()......
  • echarts之带图片的饼图
    相关代码:/**@Author:wxl*@Date:2022-11-0408:22:23*@LastModifiedby:wxl*@LastModifiedtime:2022-12-1217:32:58*/<template><!--饼图--><div:id="histogramId"v-bind:style="{height:height,width:width}&quo......
  • 『Echarts』简介
    目录一、前言二、『Echarts』简介1.什么是『Echarts』三、数据可视化四、『Echarts』1.『Echarts』的作用2.『Echarts』能绘制哪些图表3.『Echarts』显示图表的原理五、总结一、前言本篇文章是『Echarts』系列文章的第1篇,主要介绍『Echarts』简介经过前面文章的介绍,大......
  • vue echarts hooks 封装
    vue中echartshooks的封装,监听主体的变化,监听窗口大小的变化。监听元素大小的变化hooksimportechartsfrom'@/echart/themeInit'import{debounce}from'@/utils/dehounce'import{useAppStore}from'@/pinia'constuseEchartHooks=(id,groupId)=>{......
  • Echarts5.0——点击还原按钮图形空白问题
    前言看下文档就可以知道问题出哪了,在setOption的时候配置下notMerge就好了,详细的可以访问文档自行查看;setOption:https://echarts.apache.org/zh/api.html#echartsInstance.setOption步骤this.chartInstance.setOption(this.option,true);render(){this.chartIns......