echarts 地图去除对应地点的标识小圆点

地图中出现地图标识小圆点,怎么调整都删除不了,如下图所示:

D2A23A0D-F316-443b-BF57-F8851FC63E81.png

具体可以参照下面的方法解决:

方法一

原因是地图添加 legend 属性后会出现地图标识点,需在地图的 series.itemStyle 中 添加 color: 'transparent',将图标颜色隐藏;

方法二

在 series 属性中配置 showLegendSymbol: false;

实际栗子:

如果你的地图是多地图底色渲染,就像下面这个例子:

series: [
  {
      type: 'map',
      roam: false,
      zoom: 1.2,
      label: {
          ...
       },
      map: '地图',
      data: [],
  },
  {
      type: 'effectScatter',
      coordinateSystem: 'geo',
      showEffectOn: 'render',
      layoutCenter: [ '50%', '50%' ],
      layoutSize: '100%',
      symbol: `image://${ require('所要加载的图片地址') }`,
      symbolSize: [ 21, 25 ],
      label: {
          ...
       },
      data: [],
  },
]

像上面这种情况,就需要给 type: 'map'type: 'effectScatter' 都配置隐藏的配置。

series: [
  {
      type: 'map',
      roam: false,
      zoom: 1.2,
      label: {
          ...
       },
      map: '地图',
      data: [],
     // NOTE: 这里需要添加 showLegendSymbol 属性
      showLegendSymbol: false
  },
  {
      type: 'effectScatter',
      coordinateSystem: 'geo',
      showEffectOn: 'render',
      layoutCenter: [ '50%', '50%' ],
      layoutSize: '100%',
       // NOTE: 方法2:如果只为了去除标记圆点,配置 symbol 就行
      symbol: 'none',
      // NOTE: 方法1:如果除了标记圆点后还有其他样式,但只想去除圆点,就通过颜色处理,同时给图形大小
      symbolSize: [ 1, 1 ],
      label: {
          ...
       },
       itemStyle: {
        // NOTE: 方法1:如果除了标记圆点后还有其他样式,但只想去除圆点,就通过颜色处理
         color: 'transparent',
        ...  
      },
      data: [],
  },
]

效果图:


463E34D5-1DEB-4d19-803E-BFFB108CBBDC.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容