leaflet——Lmap

添加插件(当小模块使用的时候,可以不引用Lmap.js,直接引用相应插件)

paths

 paths: {
   "css":"css",
    "leaflet": "leaflet-src",
    "markercluster":"leaflet.markercluster",
    "ChineseTmsProviders": "leaflet.ChineseTmsProviders",//切换地图地图插件
    "measure": "leaflet.measure",//距离测量插件
    "measureArea": "leaflet.area",//面积测量插件
    "LMapDraw": "LMapDraw",
    "terraformer": "terraformer",
    "terraformer-wkt-parser": "terraformer-wkt-parser"
},

changeMap(改变图层)

changeMap: function (map,layerType) {
if (MapObj.property.baseLayers) {
    map.removeLayer(MapObj.property.baseLayers);
}
var Layers = [];
if (layerType == MapObj.property.mapLayerType.google) {

    Layers.push(MapObj.mapOpetation.Layer.downloadimage.satellite.setZIndex(0));
    Layers.push(MapObj.mapOpetation.Layer.downloadimage.overlay.setZIndex(1));

}
else if (layerType == MapObj.property.mapLayerType.googlevector)
{
    //Layers.push(MapObj.mapOpetation.Layer.google.normalMap.setZIndex(0));
    Layers.push(MapObj.mapOpetation.Layer.downloadimage.roadmap.setZIndex(0));
}
else if (layerType == MapObj.property.mapLayerType.tianditu)
{
    Layers.push(MapObj.mapOpetation.Layer.tianditu.satelliteMap.setZIndex(0));
    Layers.push(MapObj.mapOpetation.Layer.tianditu.asatelliteMap.setZIndex(1));
}
else if (layerType == MapObj.property.mapLayerType.tiandituvector)
{
    Layers.push(MapObj.mapOpetation.Layer.tianditu.normalMap.setZIndex(0));
    Layers.push(MapObj.mapOpetation.Layer.tianditu.annotion.setZIndex(1));
}
MapObj.property.baseLayers = L.layerGroup(Layers);
map.addLayer(MapObj.property.baseLayers);
},

showMap:显示图层

showMap: function (mapId, layerType, lon, lat, zoom) {//显示基本地图,地图类型,经度,纬度,放大级别
   if (!lat) {
        lat = 42.48
    }
    if (!lon) {
        lon = 126.29
    }
    if (!zoom) {
        zoom = 10;
    }
    if (!layerType) {
        layerType = 0;
    }
    var Layers = [];
    if (layerType == MapObj.property.mapLayerType.tianditu) {
        Layers.push(MapObj.mapOpetation.Layer.tianditu.satelliteMap);
        Layers.push(MapObj.mapOpetation.Layer.tianditu.asatelliteMap);
    }
    if (layerType == MapObj.property.mapLayerType.tiandituvector) {
        Layers.push(MapObj.mapOpetation.Layer.tianditu.normalMap);
        Layers.push(MapObj.mapOpetation.Layer.tianditu.annotion);
    }
    else if (layerType == MapObj.property.mapLayerType.google) {
        //__proto__.__proto__.options.__proto__.opacity =
        //MapObj.mapOpetation.Layer.google.satelliteMap.setOpacity(1);

        Layers.push(MapObj.mapOpetation.Layer.google.satelliteMap);
        Layers.push(MapObj.mapOpetation.Layer.google.asatelliteMap);
        //Layers.push(MapObj.mapOpetation.Layer.google.asatelliteMap);
    }
    else if (layerType == MapObj.property.mapLayerType.googlevector) {
        Layers.push(MapObj.mapOpetation.Layer.google.normalMap);

    }
    MapObj.property.baseLayers = L.layerGroup(Layers);
    var map = L.map(mapId, {
        center: [lat, lon],
        zoom: zoom,
        doubleClickZoom:false,
        //layers: Layers,
        zoomControl: false
    });
    map.addLayer(MapObj.property.baseLayers);
    MapObj.toolBar.printer = L.easyPrint({
        tileLayer: Layers,
        sizeModes: ['Current', 'A4Landscape', 'A4Portrait'],
        filename: 'myMap',
        exportOnly: true,
        hideControlContainer: true
    }).addTo(map);
    $(".leaflet-control-easyPrint").css("display", "none");
    return map
},

toolBar(地图常用工具条)常用

printMap(打印地图)

printMap: function (mapObj,name) {//打印地图
   width = mapObj.clientWidth,//shareContent.offsetWidth; //获取dom 宽度
   height = mapObj.clientHeight,//shareContent.offsetHeight; //获取dom 高度
   canvas = document.createElement("canvas"), //创建一个canvas节点
   scale = 1; //定义任意放大倍数 支持小数
    canvas.width = width * scale; //定义canvas 宽度 * 缩放
    canvas.height = height * scale; //定义canvas高度 *缩放
    canvas.style.width = mapObj.clientWidth * scale + "px";
    canvas.style.height = mapObj.clientHeight * scale + "px";
    canvas.getContext("2d").scale(scale, scale); //获取context,设置scale
    var opts = {
        scale: scale, // 添加的scale 参数
        canvas: canvas, //自定义 canvas
        logging: false, //日志开关,便于查看html2canvas的内部执行流程
        width: width, //dom 原始宽度
        height: height,
        useCORS: true // 【重要】开启跨域配置
    };
    var laymsg = layer.msg('生成图片...', { icon: 16, shade: [0.5, '#f5f5f5'], scrollbar: false, offset: 'auto', time: 100000 });
    html2canvas(mapObj.children[0], opts).then(function (canvas) {
        // canvas宽度
        var canvasWidth = canvas.width;
        // canvas高度
        var canvasHeight = canvas.height;
        // 渲染canvas
        //$('.toCanvas').after(canvas);
        // 显示‘转成图片’按钮
        //$('.toPic').show(1000);
        // 点击转成图片
        Canvas2Image.saveAsImage(canvas, canvasWidth, canvasHeight, "png", name);
        layer.close(laymsg);
    });
},

measureDistince(距离测量)

measureDistince: function (map) {//距离测量
   this.removeDrawState();
     var config = {
         lineColor: 'red',
         lineWeight: 2,
         lineDashArray: '20, 20',
         lineOpacity: 1,
     };
     measure.initialize(config);
     measure.measureDistance(map);
     this.curDrawObj = measure;
 },

measureArea(测量面积)

measureArea: function (map) {//距离测量
   this.removeDrawState();
    var config = {
        lineColor: 'red',
        lineWeight: 2,
        lineDashArray: '20, 20',
        lineOpacity: 1,
    };
    measureArea.initialize(config);
    measureArea.measureArea(map);
    this.curDrawObj = measureArea;
    
},

registerDrawComplete(注册编辑事件)

registerDrawComplete: function (map,drawFun,editFun,isBingEdit)//注册编辑事件
{

  Draw.iniDrawComplete(map);
  map.on(L.Draw.Event.CREATED, function (e) {
      var res = "";
      res = MapObj.convert.toWkt(e.layer)
      Draw.drawItems.addLayer(e.layer)
      drawFun(res,e.layer,e.layerType)
    
      if (isBingEdit) {
          //e.layer.on("mousedown", function (m) {
          //    if (m.originalEvent.button == 2) {
          //        e.layer.editing.enable();
          //        editFun(e.layer,e.layerType)

          //    }
          //})
      }

  });
},

removeDrawState(删除绘制状态)

removeDrawState: function () {//删除绘制状态
    if (this.curDrawObj) {
        this.curDrawObj.disable();
    }
},

drawLine(画线)

drawLine: function (map, shapeOptions) {//画线
   this.removeDrawState();
    this.curDrawObj = new L.Draw.Polyline(map)
    if (shapeOptions) {
        this.curDrawObj.options.shapeOptions = shapeOptions
    }
    this.curDrawObj.enable();

},

drawRectangle (画矩形)

drawRectangle: function (map, shapeOptions) {
   this.removeDrawState();
    this.curDrawObj = new L.Draw.Rectangle(map)
    if (shapeOptions) {
        this.curDrawObj.options.shapeOptions = shapeOptions
    }
    this.curDrawObj.enable();
},

drawMark(画图标)

drawMark: function (map, icon) {//绘制图标
    this.removeDrawState();
     this.curDrawObj = new L.Draw.Marker(map);
     this.curDrawObj.options.icon = icon;
     this.curDrawObj.enable();
 },

drawPolygon(画多边形)

drawPolygon: function (map,shapeOptions) {//绘制多边形
    this.removeDrawState();
    this.curDrawObj = new L.Draw.Polygon(map);
    if (shapeOptions) {
        this.curDrawObj.options.shapeOptions = shapeOptions
    }
    
    this.curDrawObj.enable();

},

drawCircle(画圆)

drawCircle: function (map, shapeOptions) {//画圆
   this.removeDrawState();
    this.curDrawObj = new L.Draw.Circle(map);
    if (shapeOptions) {
        this.curDrawObj.options.shapeOptions = shapeOptions
    }

    this.curDrawObj.enable();
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章