便利贴--9{Cesium+js绘制多个点和多个线的图层，加标题}

代码

附加转类型从openlayers线数据转到DC的Polyline数据

changeData(data, name, value) {
      let arr = [];
      for (let k in data[name]) {
        arr.push({
          name: data[name][k],
          value:
            name == "lxname"
              ? data[value][k]
                  .split("(")[1]
                  .split(")")[0]
                  .split(",")
                  .join(";")
                  .split(" ")
                  .join(",")
              : [+data[value][k].split(",")[0], +data[value][k].split(",")[1]],
        });
      }
      return arr;
    },

value[0]是线路：使用的是"112,24;112,25"数据类型
value[1]是点
value[2]是弹窗数据，，对于图标事件使用

let addressOur = this.changeData(query, "addressname", "address");
        let lxOur = this.changeData(query, "lxname", "lx");
        console.log(addressOur, lxOur);
        that.$store.dispatch("MSET_DRAWALINELAYERMANY", [
          lxOur,
          addressOur,
          query,
        ]);

//绘画线路活动多条
    MSET_DRAWALINELAYERMANY({ state, commit, dispatch }, value) {
      //检查是否存在路线
      commit("removePolylineMany");
      commit("removePolyline");
      let Strs = value[0];
      let red = global.DC.Namespace.Cesium.Color.fromCssColorString("#FF0000");
      let white = global.DC.Namespace.Cesium.Color.fromCssColorString("#fff");
      let blue = global.DC.Namespace.Cesium.Color.fromCssColorString("#2196F3");
      let material = new global.DC.PolylineTrailMaterialProperty({
        color: red,
        speed: 10,
      });
      let drawALineLayerMany = new global.DC.VectorLayer("layer");
      state.mviewer.addLayer(drawALineLayerMany);
      //多条线
      for (let k in Strs) {
        let polyline = new global.DC.Polyline(Strs[k].value); //加入绘画点
        polyline.setStyle({
          width: 3,
          material: material,
          clampToGround: true,
        });
        drawALineLayerMany.addOverlay(polyline);
        let post = Strs[k].value.split(";")[0].split(",");
        let position = new global.DC.Position(post[0], post[1]);
        let Label = new global.DC.Label(position, Strs[k].name);
        Label.setStyle({
          font: "16px sans-serif", // CSS 字体设置
          scale: 1, //比例
          fillColor: white, //文字颜色
          showBackground: true, //是否显示背景
          backgroundColor: blue, //背景颜色
          // outlineColor: white, //边框颜色
          // outlineWidth: 10, //边框大小，
        });
        drawALineLayerMany.addOverlay(Label);
      }
      //多个点
      let point = value[1];
      for (let k in point) {
        let post = point[k].value;
        let position = new global.DC.Position(post[0], post[1]);

        let billboard = new global.DC.Billboard(
          position,
          "img/dingwei/dingwei4.png"
        ); //加入绘画点
        // billboard.setStyle({
        //   width: 3,
        //   material: material,
        //   clampToGround: true,
        // });
        //订阅事件
        billboard.on(global.DC.MouseEventType.CLICK, (e) => {
          // console.log(e);
          // return;
          // 定制化窗体
          let position = e.position,
            lntLat = [e.overlay._position._lng, e.overlay._position._lat];
          let windowData = {
            position,
            lntLat,
            query: { ...(value[2] || {}), position, lntLat },
            useJWD: true, //仅使用经纬度
          };
          dispatch("setMobileWindows", windowData);
        });
        drawALineLayerMany.addOverlay(billboard);
        let Labels = new global.DC.Label(position, point[k].name);
        Labels.setStyle({
          font: "16px sans-serif", // CSS 字体设置
          scale: 1, //比例
          fillColor: white, //文字颜色
          showBackground: true, //是否显示背景
          backgroundColor: blue, //背景颜色
          // outlineColor: white, //边框颜色
          // outlineWidth: 1, //边框大小，
          pixelOffset: { x: 0, y: -30 }, //偏移像素
        });
        //订阅事件
        Labels.on(global.DC.MouseEventType.CLICK, (e) => {
          // console.log(e);
          // return;
          // 定制化窗体
          let position = e.position,
            lntLat = [e.overlay._position._lng, e.overlay._position._lat];
          let windowData = {
            position,
            lntLat,
            query: { ...(value[2] || {}), position, lntLat },
            useJWD: true, //仅使用经纬度
          };
          dispatch("setMobileWindows", windowData);
        });
        drawALineLayerMany.addOverlay(Labels);
        // console.log(point[k]);
      }

      state.drawALineLayerMany = drawALineLayerMany;
      state.isOpenDrawALineMany = true;
      // commit("cameraSetView", state.navigationStartLngLat); //移动
    },