cesium添加多个geojson文件并分别控制显示和隐藏
/*获取geojson数据*/
function get_geojson(name,h,n){
let x=document.getElementById(n);
if(x.className === "la"){
loadgeojson(name,h,n);
x.className = "la2";
}else{
x.className = "la";
let len = viewer.dataSources.length;
if(len>0){
for(let i=0;i<len;i++){
var dataSource = viewer.dataSources.get(i);
if(dataSource._name === n){
viewer.dataSources.remove(dataSource);
}
}
}
}
}
var promise=new Array(9);
function loadgeojson(name,h,n){
let xmlhttp,p;
if (window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
} else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP_geo");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200 )
{
p=xmlhttp.response;
Cesium.Math.setRandomNumberSeed(0);//设置随机数种子
promise[n] = Cesium.GeoJsonDataSource.load(p);
promise[n].then(function (dataSource) {
viewer.dataSources.add(dataSource);
dataSource.name= n;
let entities = dataSource.entities.values;
entities.id=n;
let colorHash = {};
//可对单个实体进行设置
for (let i = 0; i < entities.length; i++) {
let entity = entities[i];//geojson里面必须得有一个name属性,entity.name对应
let name = entity.name;//可以使两个同名要素使用同一种颜色
let color = colorHash[name];
if (!color) {
color = Cesium.Color.fromRandom({
alpha : 1.0
});
colorHash[name] = color;
}
entity.polygon.material = color;
entity.polygon.outline = true;// polygon边线显示与否
entity.polygon.height=h;//底面距离地面高度
entity.polygon.extrudedHeight =h+0.2;//顶面距离地面高度
}
});
/*viewer.flyTo(promise[n]);*/
}
};
xmlhttp.open("GET","./jsp/get_geojson.jsp?floor_name="+name,true);
xmlhttp.send();
}
完整代码如上所示。
1创建promise数组,长度为geojson数据的个数;
2loadgeojson(name,h,n)函数异步加载geojson文件(服务器后台从数据库中下载json数据到本地,返回文件地址p),name为geojson数据名称,h为高度,n为id,设为datasource名称;
3getjson(name,h,n)函数,name为geojson数据名称,h为高度,n为datasource名称(参数与loadgeojson相同),datasource的id从1开始记录geojson加载顺序,判断名称是否一致,删除该资源(无序)。
4代码实现了在页面通过button控制geojson的加载和移除,对于已经加载的geojson数据,button.style.backgroundcolor变为红色(.la2样式),当移除该数据时,button回到.la样式。
cesium添加多个geojson文件并分别控制显示和隐藏的更多相关文章
- 使用 Cesium 动态加载 GeoJSON 数据
前言 需求是这样的,我需要在地图中显示 08 年到现在的地震情况,地震都是发生在具体的时间点的,那么问题就来了,如何实现地震情况按照时间动态渲染而不是一次全部加载出来. 一. 方案分析 这里面牵扯到两 ...
- MVC学习随笔----如何在页面中添加JS和CSS文件
http://blog.csdn.net/xxjoy_777/article/details/39050011 1.如何在页面中添加Js和CSS文件. 我们只需要在模板页中添加JS和CSS文件,然后子 ...
- 要将 ASP.NET 访问权限授予某个文件,请在资源管理器中右击该文件,选择“属性”,然后选择“安全”选项卡。单击“添加”添加适当的用户或组。突出显示 ASP.NET 帐户,选中所需访问权限对应的框。
找到该文件所在文件夹,右键属性,安全选项卡,添加-aspnet用户,并设置其权限为完全控制.如果还是不行,就添加一个Everyone用户并赋予完全控制权限windows server 2008中IIS ...
- VC6在win7环境下无法添加以及打开现有文件的解决办法
在VC6.0中使用键盘快捷键或者是文件菜单打开现有文件以及添加文件出现编辑器停止响应,弹出内容为Microsoft(R) Developer Studio已停止工作 Windows正在检查解决该 ...
- php添加数据到xml文件的例子
php添加数据到xml文件中 时间:2015-12-17 06:30:37来源:网络 导读:php添加数据到xml文件中 xml文件:stu.xml: 复制代码代码如下: <?xml ver ...
- Sql server之路 (三)添加本地数据库SDF文件
12月25日 今天搞了半天 添加本地数据库Sdf文件到项目里.总是出现问题. 安装环境 Vs2008 没有安装的环境 1.Vs2008 sp1 2. 适用于 Windows 桌面的 Microsoft ...
- 添加Ubuntu的库文件路径
添加Ubuntu的库文件路径 http://blog.csdn.net/r91987/article/details/6879062 关于ubuntu添加共享库路径: 1. 将绝对路径写入 /etc/ ...
- android 添加依赖的库文件
Notpad: 2016-3-16: 1.android 添加依赖的库文件 右键自己的项目 -> properties ->android ->在Library处点击add -> ...
- svn管理代码在cornerstone上无法添加.a 静态库文件
有时候.a静态库不能上传到svn的服务器 导致别人拉代码运行不了 这是因为cornerstone设置里面默认不会提交.a文件, 在上图选项栏里是cornerstone默认忽略上传的文件名后缀,在这里 ...
随机推荐
- 第一个appium测试用例
from time import sleep from appium import webdriver import pytest class TestXueqiu: user_profile_id ...
- 网络安全-主动信息收集篇第二章-二层网络扫描之arping
arping二层网络发现 介绍工具:arping arping主要查看IP的MAC地址 缺点:工具本身只能ping一个IP地址,不能ping一个IP段.但是可以通过脚本将整个网络中的IP进行扫描. 脚 ...
- CSPS模拟 73
被T3坑了 忘记考虑$atan$只会返回正数导致无法区分方向相反模长相等的两个向量 直接把向量拆成ab两个上三角函数干出来就对了 真的exhausted
- win10系统任务栏点击没有反应
今天碰到了一个神奇的bug任务栏上的图标怎么也没反应,鼠标点击不了,win+R命令行也出来不了. 经过一番研究,发现CTRL+ALT+DEL,可以打开任务管理器.所以来了一番操作: 1.先打开任务管理 ...
- Hadoop3.2.1版本的环境搭建
最近有人提出能不能发一些大数据相关的知识,No problem ! 今天先从安装环境说起,搭建起自己的学习环境. Hadoop的三种搭建方式以及使用环境: 单机版适合开发调试: 伪分布式适合模拟集群学 ...
- 『题解』[NOI2016]优秀的拆分
如果一个字符串可以被拆分为\(AABB\)的形式,其中$A和 B是任意非空字符串,则我们称该字符串的这种拆分是优秀的. 例如,对于字符串\(aabaabaa\),如果令\(A=aab\),\(B=a\ ...
- one of neural network
map source:https://github.com/microsoft/ai-edu Fundamental Principle inputs: characteristic value th ...
- T-SQL Part IV: ORDER BY
ORDER BY 返回一个Cursor,并不返回结果集.而试图将Cursor作为输入将产生了错误. 所以,下列的SQL语句将产生错误: SELECT VerID, IsComplete VerID, ...
- 产品分析:华为短信APP体验的问题和建议
- 导入maven项目pom报错
打开window->preferences->maven->user settings更换settings.xml即可