Echarts Map3D 3D地图如何设置厚度墙体颜色?

新手上路,请多包涵

echarts使用map3D 3d地图,设置了regionHeight之后,地图有厚度,这时候想单独设置厚度墙体的颜色,没有找到相关api可以设置。

然后使用一下两种方案:
1、多个3d地图重叠,一个设置regionHeight 5,一个设置0,但是高度0的地图却在底部,也没有找到高度为0的地图能悬浮在另一个3d地图上的API。没有合适的偏移量属性,都是相对于容器的偏移,不适合旋转放大。
2、多个3d地图重叠,比如一个地图设置regionHeight 5,另一个设置5.1。但是墙体颜色会有点重叠部分,旋转时还会闪烁。墙体颜色不对
没有找到合适的方案了。

其他问题:
1、边框颜色怎么设置效果,比如边框有两种颜色或者阴影;
2、设置地图纹理后,再设置单个区域的颜色时 纹理还在,怎么去除单个区域的纹理

阅读 1.9k
2 个回答

通过输出option突然发现viewControl里的center可以设置偏移量。这样可以通过多个map3d重叠实现不同层次不同颜色了!

地图option类似这么设置就可以实现,但是开启3d旋转的话,旋转会卡卡的。多个地图同时展示性能不好。。
`

  const viewControl = {
    center: [-10, 0, 13],
  };

  const mapSerie = {
    type: 'map3D',
    map: '福建省',
    show: true,
    boxWidth: 200,
    boxHeight: 0, 
    regionHeight: 6,
    aspectScale: 0.9,
    shading: 'lambert',
    itemStyle: {
      color: "#1CA7FC",
      opacity: 0.9,
      borderWidth: 2,
    },
    emphasis: {
      itemStyle: {
        color: "#1CA7FC",
        opacity: 0.9,
        borderWidth: 2,
      },
      label: {
        show: false,
      }
    },
    viewControl: viewControl,
    // instancing: true,
    zlevel: -10,
  }
  const option = {
    backgroundColor: 'transparent',
    geo3D: [
      mapSerie,
      {
        ...mapSerie,
        zlevel: -6,
        regionHeight: 12,
        itemStyle: {
          color: "blue",
          opacity: 0.9,
          borderWidth: 2,
        },
        emphasis: {
          itemStyle: {
            color: "blue",
            opacity: 0.9,
            borderWidth: 2,
          },
          label: {
            show: false,
          }
        },
        viewControl: {
          ...mapSerie.viewControl,
          center: [-10, -6, 13],
        }
      },
      
    ],
  };`
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏