当前位置： 移动技术网 > IT编程>开发语言>JavaScript > 高亮显示点要素

高亮显示点要素

2019年02月21日  | 移动技术网IT编程  | 我要评论

首先补充查询的方法：

1.获取要素图层

var layer = webscene.layers.getitemat(1);　　//如获取视图上已经显示了的图层

2.创建查询对象

var query = layer.createquery();

3.设置查询语句where语句

query.where = ""

4.查询并对查询结果进行操作

layer.queryfeatures(query).then(function(results){})

==============================================================================================================================

先上图：

1.加载底图和网络三维图

"esri/webscene","esri/views/sceneview"

var webscene = new webscene({

　　portalitem:{id:"475a7161ed194460b5b52654e29581a2"}

});

var view = new sceneview({

　　map:webscene,

　　container:"viewdiv",

　　//设置高亮显示的样式：

　　hightlightoptions:{

　　　　color:[255, 241, 58],

　　　　fillopacity:0.4

　　}

　　environment:{

　　　　atmosphereenabled:true,

　　　　atmosphere:{quality:"high"}

　　}

});

2.高亮显示分别是三个动作的结果：点击、移入、移出，所以在场景加载完毕之后触发，并实现功能。用三个函数来表示，onclick onmouseover onmouseout

webscene.when(function(){

　　//查询步1、获取要素图层

　　var layer = webscene.layers.getitemat(1);

　　view.whenlayerview(layer).then(function(layerview){　　//layerview是加载完图层之后的视图

　　　　//查询步2、创建查询对象

　　　　var query = layer.createquery();

 

　　　　var buttons = document.queryselectorall("button");

　　　　for(var i = 0,button = null;button = buttons[i];i++){

　　　　　　button.addeventlistener("click",onclick);

　　　　　　button.addeventlistener("mouseover",onmouseover);

　　　　　　button.addeventlistener("mouseout",onmouseout);

　　　　};

 

　　　　function onclick(event){

　　　　　　query.where = "nom='"+event.target.innertext+"'";

　　　　　　layer.queryfeatures(query).then(function(result){

　　　　　　　　if(highlightselect){

　　　　　　　　　　highlightselect.remove();

　　　　　　　　}

　　　　　　　　var feature = result.features[0];

　　　　　　　　highlightselect = layerview.highlight(feature.attributes["objectid"]);

　　　　　　　　view.goto({

　　　　　　　　　　target:feature.geometry,

　　　　　　　　　　tilt:70

　　　　　　　　},{duration:2000,easing:"in-out-expo"})

　　　　　　})

　　　　}　　　　

　　　　function onmouseover(event){

　　　　　　query.where = "nom='"+event.target.innertext+"'";

　　　　　　hovernon = layer.queryfeatures(query)

　　　　　　hovernon.then(function(result){

　　　　　　　　if(highlighthover){

　　　　　　　　　　highlighthover.remove();

　　　　　　　　}

　　　　　　　　var feature = result.features[0];

　　　　　　　　highlighthover = layerview.highlight(feature.attributes["objectid"]);

　　　　　　})

　　　　}

　　　　function onmouseout(event){

　　　　　　hovernon.cancel();

　　　　　　if(highlighthover){

　　　　　　　　highlighthover.remove();

　　　　　　}

　　　　}

　　})

});

 

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网