zoukankan      html  css  js  c++  java
  • echarts map 阴影(重叠)

    export const dfOption = {
      tooltip: {
        formatter: function(params, ticket, callback) {
          return params.name + ":" + params.value;
        } // 数据格式化
      },
      visualMap: {
        min: 0,
        max: 100,
        right: 10,
        top: "bottom",
        itemWidth: 10,
        text: ["100", "数量"], // 取值范围的文字
        textStyle: {
          color: "#fff",
          fontSize: "10"
        },
        inRange: {
          color: ["#f8f2f6 ", "#4d3998", "#442a53", "#963062", "#783164", "#6e294f"] // 取值范围的颜色
        },
        show: true // 图注
      },
      geo: {
        map: "df",
        roam: false, // 不开启缩放和平移
        zoom: 1.1, // 视角缩放比例
        top: 50,
        aspectScale: 1.5,
        label: {
          normal: {
            show: false,
            fontSize: "10",
            color: "rgba(0,0,0,0.7)"
          }
        },
        itemStyle: {
          normal: {
            areaColor: "#CDDCEF",
            borderColor: "#506FDB",
            borderWidth: 1,
            borderType: "solid",
            opacity: 0.8,
            shadowBlur: 10,
            shadowColor: "#080D15",
            shadowOffsetX: 5,
            shadowOffsetY: 5,
          },
          emphasis: {
            areaColor: {
              type: "linear",
              x: 0,
              y: 0,
              x2: 0,
              y2: 1,
              colorStops: [{
                offset: 0, color: "#fff" // 0% 处的颜色
              }, {
                offset: 1, color: "#fff" // 100% 处的颜色
              }],
              globalCoord: false // 缺省为 false
            }
          }
        },
      },
      series: [
        {
          type: "map",
          geoIndex: 1,
          aspectScale: 1.5,
          map: "df",
          zoom: 1.1,
          top: 44,
          roam: false,
          nameProperty: "name",
          selectMode: "single",
          label: {
            normal: {
              show: true,
              fontSize: "12",
              color: "#D4D6DD"
            }
          },
          itemStyle: {
            normal: {
              borderColor: "#506FDB",
              borderWidth: "0.5",
              shadowBlur: 5,
              shadowColor: "#999",
              shadowOffsetX: 5,
              shadowOffsetY: 5,
            },
            emphasis: {
              areaColor: {
                type: "linear",
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [{
                  offset: 0, color: "#fff" // 0% 处的颜色
                }, {
                  offset: 1, color: "#fff" // 100% 处的颜色
                }],
                globalCoord: false // 缺省为 false
              }
            }
          },
          data: []
        }
      ]
    };
    

      

    主要在于geo 与 series 两层重叠的处理。

  • 相关阅读:
    java NIO 总结
    NIO 服务器和客户端 demo
    nio channel demo
    使用docker制作zookeeper镜像
    java BIO模型demo
    IDEA中语句添加try....catch..语句块
    线程的几种创建方式
    海豚调度Dolphinscheduler源码分析(四)
    @PostConstruct注解
    zookeeper常用命令
  • 原文地址:https://www.cnblogs.com/sxdjy/p/14109070.html
Copyright © 2011-2022 走看看