zoukankan      html  css  js  c++  java
  • 利用arcgis api实现自定义查询

    在这里使用下拉菜单和输入框两个部分实现地图中位置的查询

    搜索界面

     <div class="search" style="z-index: 2000">
          <div class="search-select">
            <select name="" id="select" class="select">
              <option value="">请选择---</option>
              <option
                v-for="item in kindList"
                v-bind:key="item.value"
                v-text="item.name"
              ></option>
            </select>
          </div>
    
          <div class="spilt"></div>
    
          <input
            type="text"
            name="find"
            id="find"
            class="search-find"
            placeholder="请输入内容"
          />
          <button id="do-find" class="do-find"></button>
    
          <!-- <div class="btn_find">
                    <button></button>
                </div> -->
        </div>

    js方法定义

    需要引入Search 类

    import Search from "@arcgis/core/widgets/Search";

    // 添加搜索组件
          var searchWidget = new Search({
            view: mapView,
          });
    
          const btn_search = document.getElementById("do-find");
          const input_find = document.getElementById("find");
    
          btn_search.addEventListener("click",function(){
              const select_value = document.getElementById("select");
              // alert(select_value.value);
              
              dosearch(select_value.value + input_find.value);
          });
          function dosearch(value){
              searchWidget.search(value);
          }
          // 搜索组件添加结束
  • 相关阅读:
    类的无参方法笔记
    类的无参预习内容
    类和对象
    洛谷 题解 P2010 【回文日期】
    洛谷 题解 CF711A 【Bus to Udayland】
    洛谷 题解 P2676 【超级书架】
    洛谷 题解 CF903B 【The Modcrab】
    洛谷 题解 P1585【魔法阵】
    HDU 2553【N皇后问题】
    一些函数
  • 原文地址:https://www.cnblogs.com/1gaoyu/p/15129569.html
Copyright © 2011-2022 走看看