mars3d对geojson图层分属性设置样式

148 篇文章 2 订阅
132 篇文章 0 订阅
开发中可能会遇到如下需求,在全省的数据中按某个属性⾼亮展示某市区。此时就需要使⽤分属性样式的api了。⽂档如下。 GeoJsonLayer - Mars3D API文档

属性是根据⽮量数据的属性进⾏匹配。可以通过    layer.graphics[0]?.attr   ⽅式获取。
指导有哪些属性之后先设置   symbol.styleField    为你需要的属性,如:
layer . setOptions ({
symbol : {
styleField : name ,
},
});
然后将属性值作为键,样式对象作为值设置 styleFieldOptions 属性,也可以直接在构造
GeoJsonLayer 传⼊。
new mars3d . layer . GeoJsonLayer ({
id : 1987 ,
name : " ⽤地规划 " ,
// 1. ⽀持 URL
url : "//data.mars3d.cn/file/geojson/guihua.json" ,
// 2. 也⽀持直接传⼊数据
// data: {
// type: "FeatureCollection",
// name: " ⽤地规划 ",
// features: [] // 数据已省略,可以从上⾯ guihua.json 中复制
// },
symbol : {
type : "polygonC" ,
styleOptions : {
opacity : 0.6 ,
color : "#0000FF"
},
styleField : " 类型 " ,
styleFieldOptions : {
⼀类居住⽤地 : { color : "#FFDF7F" },
⼆类居住⽤地 : { color : "#FFFF00" },
社区服务⽤地 : { color : "#FF6A38" },
幼托⽤地 : { color : "#FF6A38" },
商住混合⽤地 : { color : "#FF850A" },
⾏政办公⽤地 : { color : "#FF00FF" },
⽂化设施⽤地 : { color : "#FF00FF" },
⼩学⽤地 : { color : "#FF7FFF" },
初中⽤地 : { color : "#FF7FFF" },
体育场⽤地 : { color : "#00A57C" },
医院⽤地 : { color : "#A5527C" },
社会福利⽤地 : { color : "#FF7F9F" },
商业⽤地 : { color : "#FF0000" },
商务⽤地 : { color : "#7F0000" },
营业⽹点⽤地 : { color : "#FF7F7F" },
⼀类⼯业⽤地 : { color : "#A57C52" },
社会停⻋场⽤地 : { color : "#C0C0C0" },
通信⽤地 : { color : "#007CA5" },
排⽔⽤地 : { color : "#00BFFF" },
公园绿地 : { color : "#00FF00" },
防护绿地 : { color : "#007F00" },
河流⽔域 : { color : "#7FFFFF" },
配建停⻋场 : { color : "#ffffff" },
道路⽤地 : { color : "#ffffff" }
}
},
popup : " 类型 :{ 类型 }"
// flyTo: true,
})
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
mars3d是一个用于构建三维地球可视化应用的开源JavaScript库。它包含了一系列的功能和工具,可以用于加载和展示地理数据,其中包括geojson数据。 对于mars3d中的geojson图层,有几种不同的使用方法。首先,你可以使用mars3d.layer.GeoJsonLayer类来创建一个geojson图层对象。你可以传入一个geojson文件的URL作为参数,然后mars3d库将自动加载并解析该文件,并在地球上显示对应的矢量数据。你还可以通过设置symbol属性来定义矢量数据的样式,比如颜色和宽度。此外,你还可以使用popup属性设置弹出窗口的内容。 如果你希望在加载geojson数据时进行一些自定义处理,例如计算贴地线坐标或者修改矢量数据的样式,你可以使用onCreateGraphic字段来自定义处理逻辑。在这个回调函数中,你可以访问到每个要素的坐标和属性信息,并进行相应的处理。例如,你可以使用mars3d.PolyUtil.computeSurfaceLine方法来计算贴地线坐标,并创建一个mars3d.graphic.WallPrimitive对象来表示墙体。然后,你可以将这个对象添加到geojson图层中,以在地球上显示出来。 另外,对于更复杂的地理数据处理需求,你还可以使用leaflet-stream库与mars3d结合使用。这个库可以将geojson数据流式传输到地图上,同时可以进行一些属性转换和处理操作。你可以通过引入leaflet-stream库并使用其API来实现这些功能。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [记录mars3d的使用 - geojson图层](https://blog.csdn.net/Juzimhh/article/details/123545683)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [leaflet-stream:管道 geojson 到地图](https://download.csdn.net/download/weixin_42097208/19778560)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值