echart地图组件相关配置

geo.zoom
复制代码
 geo: [
        // 提供各省边框
        {
          map: 'china',
          label: {
            show: false,
          },
          itemStyle: {
            areaColor: 'rgb(255, 255, 255, 0)',
            borderWidth: 3,
            borderColor: '#A1E0F3',
          },
          emphasis: {
            disabled: true,
          },
          silent: true,
          shadowOffsetY: 50,
          zlevel: 5,
          zoom: 1.15,
          top: '10%',
          aspectScale: 0.8,
        },
复制代码

 或者:

 series: [
        {
          name: "MAP",
          type: "map",
          mapType: name,
          selectedMode: "false", //是否允许选中多个区域
          zoom: 1.4,

 select:{} //目标区域点击选中时的样式!!!

 

layoutCenter: "100%":
layoutCenter 和 layoutSize 提供了除了 left/right/top/bottom/width/height 之外的布局手段。

在使用 left/right/top/bottom/width/height 的时候,可能很难在保持地图高宽比的情况下把地图放在某个盒形区域的正中间,并且保证不超出盒形的范围。此时可以通过 layoutCenter 属性定义地图中心在屏幕中的位置,layoutSize 定义地图的大小。如下示例

设置这两个值后 left/right/top/bottom/width/height 无效。

aspectScale

这个参数用于 scale 地图的长宽比,如果设置了projection则无效。

最终的 aspect 的计算方式是:geoBoundingRect.width / geoBoundingRect.height * aspectScale

posted @   SimoonJia  阅读(840)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?
点击右上角即可分享
微信分享提示