ArcGIS API for JavaScript之时间滑块功能（影像服务）

最新推荐文章于 2020-11-13 15:32:51 发布
最新推荐文章于 2020-11-13 15:32:51 发布
阅读量4.3k 收藏 11
点赞数 5
分类专栏： ArcGIS API for JavaScript 文章标签： javascript arcgis
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/smss007/article/details/78852077
版权
本文介绍如何使用ArcGIS API for JavaScript实现时间滑块功能，特别是针对影像服务。通过新建镶嵌数据集，将不同年份的影像放入其中，并添加日期字段。然后，将这一镶嵌数据集添加到地图并展示时间滑块效果，具体实现代码适用于API版本3.23。
摘要由CSDN通过智能技术生成

官方示例：https://developers.arcgis.com/javascript/3/jssamples/time_sliderwithdynamiclayer.html

  官方示例使用的是矢量数据，当我们想将影像做成这种效果应该怎么办呢？

参考文档：http://resources.arcgis.com/zh-cn/help/main/10.1/index.html#//009t000000v1000000

1、新建镶嵌数据集，一个年份的影像放到一个镶嵌数据集中，最后加载到一个空的镶嵌数据集“mo”；

2、将“mo”这个总的镶嵌数据集拖到地图窗口，右击Footprint -> 打开属性表 -> 添加date字段；

这里写图片描述
这里写图片描述
这里写图片描述

3、 右击“mo”镶嵌数据集 -> 属性 -> 设置时间属性；

这里写图片描述

4、发布影像服务，打开服务rest信息页面，查看其是否有 时间信息；

这里写图片描述
这里写图片描述

5、代码调用该服务，代码如下（api版本为3.23）：

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type"
最低0.47元/天 解锁文章
豆脑就要吃咸的
关注
专栏目录
arcgis api for js接入天地图影像（墨卡托）（arcgis api for js篇.7）
GIS之家家长
03-04 469
GIS之家总目录（订阅之前请先查看该博客） GIS之家：openlayer+mapbox+arcgis api for js等相关内容的介绍 地图之家总目录 地图之家：cesium+leaflet+地图数据+地图工具等相关内容的介绍 文章末尾处提供保证可运行完整代码包，运行如有问题，可“私信”博主。 效果如下所示： 下面献上完整代码，代码重要位置会做相应解释 <html> <head> <meta charset="utf-8" /> <m.
ArcGis API for JavaScript——时间轴
我的CSDN
05-04 7979
**ArcGis API for JavaScript——时间轴** ArcGis API for JS提供了添加时间轴的API：TimeSlider。TimeSlider控件可以用来展示包含时间属性的地图图层。 官方API：https://developers.arcgis.com/javascript/3/jsapi/timeslider-amd.html 一、 准备数据
arcgis api for javascript学习-时间滑块TimeSlider实现（影像服务）
Zzzpiu的博客
11-13 1698
文章目录前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结 前言 时间滑块可以用来观察历史数据和当前数据的差异，由于本人的菜鸡操作，查阅了一些资料，才实现了将官方demo的矢量数据的时间滑块做成了影像数据的时间滑块。 提示：以下是本篇文章正文内容，下面案例可供参考 一、pandas是什么？ 示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。 二、使用步骤 1.引入库 代码如下（示例）： import numpy as np import pandas
JS时间滑条控件（timeSlider）
08-02
本应用在TigraSlider滑条控件的基础上，扩展了时间滑条的功能。 扩展了两个JS方法： （1）任一整数转换成时间格式字符串函数：intToTime() （2）将时间格式字符串转换成整数函数：timeToInt() TigraSlider示例请参照：demo.html 时间滑条控件示例请参照：timeSlider.html
arcgis api for JavaScript学习-时间滑块
Zzzpiu的博客
10-08 600
时间滑块 从arcgis10开始，esri提供了对时态感知图层的支持，该图层中存储了数据集随着时间变化的状态，可用于显示一段时间时间内数据中的模式和变化趋势，比如美国人口随时间的迁移，以及土地利用的变化情况等，而Arcgis api for js提供了时间滑块控件，用于在web端对事态感知图层提供支持。在使用时间滑块的时候需要了解一些名词，如：时间范围，以及时间停靠点等。 名词解释: 1.1时...
arcgis的TimerSlider用法指导
08-09
arcgis的TimerSlider用法指导，很完整，很详细。。
Jquery时间滑块TimeSlider增强显示（精简优化，有刻度，有调用方法）
10-12
Jquery时间滑块TimeSlider增强显示。 有刻度，可用CSS设置长短，可以隐藏中间部分刻度的标签。 调用方法： $("#timeBarSlider") .slider({ min: 0, max: 1440, range: false, value: 0, slide: function (event, ui) { //滑动过程中显示实时的值（时间） $("#days").val(intToTimeStr(ui.value)); } }) .slider("pips", { rest: "label" }) .slider("float"); $("#timeBarSlider").on("slidechange", function (e, ui) { //滑动/点击标签结束后的值（时间） $("#days").val("结果：" + intToTimeStr(ui.value)); //alert("结果：" + intToTimeStr(ui.value)); }); function setValue() { //设定值 $("#timeBarSlider").slider('option', 'value', 720); ; } //数字（分钟）转时间格式（时:分）的字符串 function intToTimeStr(num) { var myhour = Math.floor(num / 60); var myMinute = num % 60; if (myhour < 10) { myhour = "0" + myhour; } if (myMinute < 10) { myMinute = "0" + myMinute; } return myhour + ":" + myMinute; }
arcgis for js 动态依次展示图块graphic
左直拳的马桶_日用桶
12-04 1681
怎样将一个图层中的图块（graphic），逐个显示在地图上，以呈现一种动画效果？在我目前做的这个项目中，这些图块，其实都是同一个工程的开展面积，不同时期，面积不同。客户要求按照工程的历程，逐个展示这些面积，以形成一个动态、直观的效果。 思路其实也简单： 1、将图层中的图块读出来 2、依次在地图上显示这些图块 3、依次，可以用arcgis for js自带的控件: ersi/dijit/T
TimeSlider-基于时间的TrackBar
04-06
使用日期而不是整数值的自定义轨迹栏控件。
ArcEngine+C#二次开发教程_3SDN
01-03
ArcEngine+C#二次开发教程，实现arcgis的部分功能，地图缩放平移、鹰眼、渲染等
Arcgis Api for JavaScript 3.17
12-04
总结，ArcGIS API for JavaScript 3.17是构建GIS应用的重要工具，虽然它是一个基础版本，但其全面的功能和易用性使其在Web地图开发领域占据一席之地。无论你是新手还是有经验的开发者，都可以在这个平台上找到发挥的...
设置和使用地图的范围—ArcGIS API for JavaScript
GISXX
08-03 1万+
设置地图的范围或获得地图范围是使用地图时常见操作。在地图上设置新范围的一个简单的替代方法是在地图上调用centerAndZoom()法，该方法基于给定的中心点和缩放级别设置新的范围。
ArcGIS API for Javascript介绍
奋斗---现在进行时
12-09 1702
ArcGIS API for Javascript介绍
如何使用ArcGIS时间滑块制作动画
热门推荐
weixin_42223381的博客
08-04 1万+
说明：我们今天主要使用时间滑块来制作动画 数据如图所示： 1.首先我们打开ArcMap，把我们的数据加载进去，如图所示： 2.右击Export_Output图层，单击属性，进入图层属性，找到【时间】标签，如图所示： 3.选中【在此图层中启用时间】复选框。因为添加时态数据集后，必须先设置其时间属性，才能在ArcMap中使用【时间滑块】来显示随时间变化的数据。 4.单击【图层时间】下拉框...
js实现时间滑块的移动和自动播放
海上漂泊的妞
10-20 3152
html> html> head lang="en"> title>title> script type="text/javascript" src="../js/jquery-1.3.2.min.js">script> script type="text/javascript"> //滑块的移动 $(function () {
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值