zoukankan      html  css  js  c++  java
  • openlayer 地图实现圈选框选清楚 选择地图区域

                 <el-button
                            size="mini"
                            type="primary"
                            @click="graph('rectangle')"
                            >框选</el-button
                          >
                          <el-button
                            size="mini"
                            type="primary"
                            @click="graph('Circle')"
                            >圈选</el-button
                          >
                          <el-button
                            size="mini"
                            type="warning"
                            @click="graph('clear')"
                            >清除</el-button
                          >
      graph(e) {
          this.$refs.HomeMap.addCircle(e);
        },
      addCircle(e) {
          var that = this;
          let source = new sourceVector({ wrapX: false });
          if (that.clickLayerEvt) {
            unByKey(that.clickLayerEvt);
            that.clickLayerEvt = "";
          }
          that.map.removeLayer(that.vectorCircle);
          that.map.removeInteraction(that.drawCircle);
          if (e == "rectangle") {
            that.drawCircle = new Draw({
              source: source,
              type: "Circle",
              freehand: false,
              geometryFunction: new createBox(),
            });
            that.map.addInteraction(that.drawCircle);
          } else if (e == "Circle") {
            that.drawCircle = new Draw({
              source: source,
              type: "Circle",
            });
            that.map.addInteraction(that.drawCircle);
          } else {
            that.map.removeInteraction(that.drawCircle);
            that.map.removeLayer(that.vectorCircle);
            that.map.removeLayer(that.Layer);
            return;
          }
          that.drawCircle.on("drawstart", function () {
            that.map.removeLayer(that.vectorCircle);
            that.vectorCircle = new LayerVector({
              source: source,
              zIndex: 10000,
            });
            that.map.addLayer(that.vectorCircle);
          });
          that.drawCircle.on("drawend", function (data) {
            if (e == "Circle") {
              that.map.removeInteraction(that.drawCircle);
            }
          });
        },
  • 相关阅读:
    2015年9月29日html基础加强学习笔记
    2015年9月30日html表单笔记
    2015年10月1日登陆界面表单练习
    linux 常用命令
    OSI七层模型与TCP/IP层次模型
    谈谈字符串那点事
    vim 常用命令
    VB Pcode 动态调试要点
    数据类型方法
    join()和fromkeys()的用法与注意事项
  • 原文地址:https://www.cnblogs.com/leroywang/p/14029506.html
Copyright © 2011-2022 走看看