zoukankan      html  css  js  c++  java
  • Arcgis api for javascript学习笔记(4.5版本)

    在Arcgis api for javascript 3.x 版本中,我们可以直接通过某个FeatureLayer对象中的graphics属性获取要素集合。  graphics属性

    但是在4.x版本中,FeatureLayer对象并未提供graphics属性。所以我们要获取必须通过某些query的函数来实现。

    方法一: 通过FeatureLayer中的queryFeatures()函数。 queryFeatures()函数

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
        <title>FeatureLayer - 4.7</title>
        <style>
            html, body, #viewDiv {
                padding: 0;
                margin: 0;
                height: 100%;
                width: 100%;
            }
        </style>
        <link rel="stylesheet" href="https://js.arcgis.com/4.7/esri/css/main.css">
        <script src="https://js.arcgis.com/4.7/"></script>
    </head>
    <body>
    <div id="viewDiv"></div>
    <script type="text/javascript">
        require([
                "esri/Map",
                "esri/views/MapView",
                "esri/layers/FeatureLayer",
                "dojo/domReady!"
            ],
            function (Map, MapView, FeatureLayer) {
                let map = new Map({
                    basemap: "hybrid"
                });
    
                let view = new MapView({
                    container: "viewDiv",
                    map: map,
                    extent: { // autocasts as new Extent()
                        xmin: -9177811,
                        ymin: 4247000,
                        xmax: -9176791,
                        ymax: 4247784,
                        spatialReference: 102100
                    }
                });
    
                let featureLayer = new FeatureLayer({
                    url: "https://services.arcgis.com/V6ZHFr6zdgNZuVG0/arcgis/rest/services/Landscape_Trees/FeatureServer/0"
                });
                map.add(featureLayer);
    
                view.when(function () {
                    featureLayer.queryFeatures().then(function (results) {
                        console.log(results.features);
                    });
                });
            });
    </script>
    </body>
    </html>

    这种方式有一个缺点就是,需要再一次向服务器发送一条查询的请求,其实照理说完全可以在已有的FeatureLayer对象中获取它的要素集合。

    方法二:通过FeatureLayerView中的queryFeatures()函数来实现,它不会再一次向服务器发送请求。 FeatureLayerView中的queryFeatures()函数

     

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
        <title>FeatureLayer - 4.7</title>
        <style>
            html, body, #viewDiv {
                padding: 0;
                margin: 0;
                height: 100%;
                width: 100%;
            }
        </style>
        <link rel="stylesheet" href="https://js.arcgis.com/4.7/esri/css/main.css">
        <script src="https://js.arcgis.com/4.7/"></script>
    </head>
    <body>
    <div id="viewDiv"></div>
    <script type="text/javascript">
        require([
                "esri/Map",
                "esri/views/MapView",
                "esri/layers/FeatureLayer",
                "dojo/domReady!"
            ],
            function (Map, MapView, FeatureLayer) {
                let map = new Map({
                    basemap: "hybrid"
                });
    
                let view = new MapView({
                    container: "viewDiv",
                    map: map,
                    extent: { // autocasts as new Extent()
                        xmin: -9177811,
                        ymin: 4247000,
                        xmax: -9176791,
                        ymax: 4247784,
                        spatialReference: 102100
                    }
                });
    
                let featureLayer1 = new FeatureLayer({
                    url: "https://services.arcgis.com/V6ZHFr6zdgNZuVG0/arcgis/rest/services/Landscape_Trees/FeatureServer/0"
                });
                map.add(featureLayer1);
    
                view.when(function () {
                    //地图刚初始化时获取graphics集合,需要监控featureLayer的updating状态完成后才能获取到
                    view.whenLayerView(featureLayer1).then(function (lyrView) {
                        lyrView.watch("updating", function(){
                            lyrView.queryFeatures().then(function (results) {
                                console.log(results);
                            });
                        });
                    });
    
                    //地图加载完成后,可以随时获取featureLayer中的graphics集合
                    view.on("double-click",function () {
                        view.whenLayerView(featureLayer1).then(function (lyrView) {
                            lyrView.queryFeatures().then(function (results) {
                                console.log(results);
                            });
                        });
                    });
                });
            }
        );
    </script>
    </body>
    </html>
  • 相关阅读:
    【笔记】vue中websocket心跳机制
    【笔记】MySQL删除重复记录保留一条
    oss上传实例
    jquery实现图片点击旋转
    IDEA卡顿解决方法
    斐波那契数列
    【笔记】接口发送数据及接收
    【笔记】获取新浪财经最新的USDT-CNY的汇率
    【笔记】Java 信任所有SSL证书(解决PKIX path building failed问题)
    IDEA中报错“cannot resolve symbol toDF”,但编译正确可以运行
  • 原文地址:https://www.cnblogs.com/tracine0513/p/9152819.html
Copyright © 2011-2022 走看看