在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>

Arcgis api for javascript学习笔记(4.5版本) - 获取FeatureLayer中的graphics集合的更多相关文章

  1. Arcgis api for javascript学习笔记(4.6版本) - 二维MapView中的FeatureLayer显示标注

    4.6版本api的FeatureLayer中有提供 labelsVisible 和 labelingInfo 两个属性,设置这两个属性可以实现显示将属性中某个字段作为标注.但是这两个属性只针对三维Sc ...

  2. Arcgis api for javascript学习笔记(4.5版本) - 本地部署及代理配置

    在开发过程中,由于api的文件比较多,没必要每个项目都将api加入到解决方案中.况且在VS中如果将api加入解决方案,在编写css或js代码时,由于智能提示需要扫描脚本等文件,会导致VS很卡.所以个人 ...

  3. Arcgis api for javascript学习笔记(3.2X版本)-初步尝试

    Arcgis api for javascript(3.22版本)官方地址 :https://developers.arcgis.com/javascript/3/ 1. 根据官方示例实现一个简单地图 ...

  4. Arcgis api for javascript学习笔记(4.5版本) - 点击多边形(Polygon)并高亮显示

    在现在的 arcgis_js_v45_api 版本中并没有直接提供点击Polygon对象高亮显示.需要实现如下几个步骤: 1.点击地图时,获取Polygon的Graphic对象: 2.对获取到的Gra ...

  5. Arcgis api for javascript学习笔记(4.5版本)-三维地图实现弹窗功能

    1. 对于Graphic对象,在初始化Graphic对象时设置popupTemplate属性,即可实现点击Graphic时显示弹窗. <!DOCTYPE html> <html> ...

  6. Arcgis api for javascript学习笔记(4.5版本)-三维地图的飞行效果

    其实就只是用到了 view.goTo()  函数,再利用 window.setInterval()  函数(定时器)定时执行goTo().代码如下: <!DOCTYPE html> < ...

  7. Arcgis api for javascript学习笔记(4.5版本)-三维地图并叠加天地图标注

    1.三维地图实现 在官网的demo中就有三维地图的实现,如下图所示 <!DOCTYPE html> <html> <head> <meta charset=& ...

  8. Arcgis api for javascript学习笔记(3.2X版本)-Map图层叠加以及基本操作

    1. 不设置默认底图,第一个图层作为底图,然后叠加另外一个图层 先添加图层1,第一个图层1作为默认底图,然后在图层1上叠加图层2,并设置图层2的透明度为50%. <!DOCTYPE html&g ...

  9. Arcgis api for javascript学习笔记(3.2版本) - 匀速行驶轨迹动画效果

    一.前言 有这样一个需求:已知某条线上的n个点的经纬度数组 ,实现物体运行轨迹. 如果这些点中两个距离很近,那么我们可以用一个定时器在地图上每次重新画一个点,这样肉眼看到这个点上的运动效果,如下图代码 ...

随机推荐

  1. FTP 访问的形式

    主要是扼要的列举一下访问的方式,不涉及太具体的内容.大家可以在百度上搜索一下具体的操作方法. 主要有: 1. 网页浏览器中输入 ftp://192.168.0.111的形式. 2. 资源管理器中输入f ...

  2. POJ 3134 - Power Calculus (IDDFS)

    题意:求仅仅用乘法和除法最快多少步能够求到x^n 思路:迭代加深搜索 //Accepted 164K 1094MS C++ 840B include<cstdio> #include< ...

  3. AM335x(TQ335x)学习笔记——Nand&amp;&amp;网卡驱动移植

    移植完毕声卡驱动之后本想再接再励,移植网卡驱动,但没想到的是TI维护的内核太健壮,移植网卡驱动跟之前移植按键驱动一样简单,Nand驱动也是如此,于是,本人将Nand和网卡放在同一篇文章中介绍.介绍之前 ...

  4. swift开发网络篇 - 用户登录POST JSON and header

    版权声明:本文为博主原创文章,未经博主允许不得转载. import UIKit import Alamofire class ViewController: UIViewController { va ...

  5. 9、getopt的用法，被用来解析命令行选项参数

    #include <unistd.h>       extern char *optarg;  //选项的参数指针       extern int optind,   //下一次调用ge ...

  6. 三、链路追踪系统 zipkin

    一.构建项目 用到的依赖直接看pom.xml的注释吧 <?xml version="1.0" encoding="UTF-8"?> <proj ...

  7. windows关闭进程 批处理端口占用

    cmd 关闭进程java taskkill /F /IM java.exe taskkill /f /im java.exe 如何用dat批处理文件关闭某端口对应程序-Windows自动化命令 如何用 ...

  8. swift学习第十三天：类的构造函数

    类的构造函数 构造函数的介绍 构造函数类似于OC中的初始化方法:init方法 默认情况下载创建一个类时,必然会调用一个构造函数 即便是没有编写任何构造函数,编译器也会提供一个默认的构造函数. 如果是继 ...

  9. blob-照片转换与展示

    File转java.sql.Blob(照片)Struts2 public Blob photos(File zp) { Blob photo=null; try { FileInputStream f ...

  10. ios开发之级联菜单（两个tableView实现）

    一:在ios项目实际开发中经常会看到级联菜单的效果:如图:点击左侧菜单,右侧菜单刷新数据.此篇用两个tableView来实现如图效果: 二:代码: 1:构造数据模型:利用kvc快速构建数据模型 #im ...