• openlayers之点,线,面(以城市,河流,省份为例,分别对应点线面)


    kpst._this这里指向初始化的map

         // 设置标注样式函数
        function createStyle(name) {
          // 河流style
          var riverStyle = new Style({
            stroke: new Stroke({
              color: '#4e89d4',
               2
            }),
            fill: new Fill({
              color: '#eee'
            })
          })
          // 省份style·
          var provinceStyle = new Style({
            stroke: new Stroke({
              color: '#4e89d4',
               1
            }),
            fill: new Fill({
              color: '#eee'
            })
          })
    
          //城市style·
          if (name != '') {
            var cityStyle = new ol.style.Style({
              image: new ol.style.Circle({
                radius: 5,
                fill: new ol.style.Fill({
                  color: '#05ab57',
                }),
                stroke: new ol.style.Stroke({
                  color: '#05ab57',
                   1
                }),
              }),
              text: new ol.style.Text({
                textAlign: "center", // 位置
                textBaseline: "top", // 基准线
                font: "normal 12px 微软雅黑", // 文字样式
                text: name,
                fill: new ol.style.Fill({
                  color: "#333",// 文本填充样式(即文字颜色)
                }),
                stroke: new ol.style.Stroke({
                  color: "#Fff",
                }),
                zIndex: 9
              })
            })
          }
          return {
            riverStyle,
            provinceStyle,
            cityStyle
          }
        }
        //创建图层
        function creatlayer(name) {
          var layer
          if (name != 'city') {
            layer = new VectorLayer({
              name: name,
              source: new VectorSource({
                // 地图的坐标系是CGCS2000,json数据也要是CGCS2000
                features: (new GeoJSON()).readFeatures(require("../../assets/data/" + name + '.json'))
              }),
              style: createStyle()[name + 'Style']
            });
    
          } else {
            var features = (new GeoJSON()).readFeatures(require("../../assets/data/city.json"))
            for (let i = 0; i < features.length; i++) {
              const feature = features[i];
              feature.setStyle(createStyle(feature.get("NAME")).cityStyle)
            }
            layer = new VectorLayer({
              name: name,
              source: new VectorSource({
                features: features
              })
            })
          }
          kpst._this.addLayer(layer);
          return layer
        };
        // 将图层加载到地图,并将所加图层赋给地图的某个对象
        function layerFx(name) {
          kpst._this[name] = creatlayer(name)
        }
        // 将图层加载函数挂载到地图
        kpst._this.layerFx = layerFx
    
    
    
  • 相关阅读:
    最小二乘法求回归直线方程的推导过程
    最小二乘法求回归直线方程的推导过程
    Redis过期键的删除策略
    Redis过期键的删除策略
    最小二乘法求回归直线方程的推导过程
    最小二乘法求回归直线方程的推导过程
    不用第三方实现内网穿透
    不用第三方实现内网穿透
    X Redo丢失的4种情况及处理方法
    Problem D: 逆置链式链表(线性表)
  • 原文地址:https://www.cnblogs.com/wwj007/p/11685932.html
Copyright © 2020-2023  润新知