当前位置:网站首页>openlayers 5.0 离散聚合点
openlayers 5.0 离散聚合点
2022-04-23 19:08:00 【Gis烤羊腿真好吃】
import {OSM, Vector as VectorSource} from 'ol/source.js';
import {Fill, RegularShape, Stroke, Style} from 'ol/style.js';
import Icon from 'ol/style/Icon.js'
import Vectorlayer from 'ol/layer/Vector.js'
import Feature from 'ol/Feature.js'
import Vector from "ol/source/Vector";
import Cluster from "ol/source/Cluster";
import Circle from "ol/style/Circle";
import Text from "ol/style/Text";
/*离散聚合点1*/
static createLayer(){
webgissource.clusterpointdate = new Vector();
webgissource.clusterSource = new Cluster({
distance:40,
source: webgissource.clusterpointdate
});
var styleCache = {};
webgissource.clusterVectorLayer = new Vectorlayer({
source: webgissource.clusterSource,
zIndex:999,
style: function (feature, resolution) {
//当前聚合标注数据源的要素大小
var size = parseInt(feature.get('features').length);
//定义样式
var style = styleCache[size];
//如果当前样式不存在则创建
// if(0<size && size<=5){
// var src="static/img/ld1.png"
// }else if(5<size && size<=10){
// var src="static/img/ld2.png"
// }else if(10<size && size<=15){
// var src="static/img/ld3.png"
// }else if(15<size && size<=20){
// var src="static/img/ld4.png"
// }else if(20<size ){
// var src="static/img/ld5.png"
// }
if(map.getView().getZoom()==17){
style = [
//初始化样式
new Style({
//点样式
fill: new Fill({
color: 'rgba(0,225,255,0.1)'
}),
stroke: new Stroke({
color: '#00e1ff',
width: 3
}),
image: new Circle({
radius: 6,
fill: new Fill({
color: '#4271ff'
})
}),
// image: new Circle({
// radius: 8,
// fill: new Fill({
// color: 'rgb(0,155,29)'
// })
// })
})
];
styleCache[size] = style;
}else{
//if (!style) {
style = [
//初始化样式
new Style({
//点样式
fill: new Fill({
color: 'rgba(0,225,255,0.1)'
}),
stroke: new Stroke({
color: '#00e1ff',
width: 3
}),
image: new Circle({
radius: size==1?6:14,
fill: new Fill({
color: '#4863ff'
})
}),
//文本样式
text: new Text({
//文本内容
text: size==1?"":size.toString(),
//填充
font: '14px',
fill: new Fill({
color: 'rgb(255,255,255)'
}),
offsetY: 0,
})
})
];
styleCache[size] = style;
//}
}
return style;
}
});
map.addLayer(webgissource.clusterVectorLayer)
}
static clusterVectorLayer(data){
var points=new Point([x,y]);
var iconFeature = new Feature({
geometry:points,
attributions:data
})
webgissource.clusterpointdate.addFeature(iconFeature)
}
版权声明
本文为[Gis烤羊腿真好吃]所创,转载请带上原文链接,感谢
https://blog.csdn.net/weixin_38190600/article/details/102488423
边栏推荐
- SSDB foundation 3
- 为何PostgreSQL即将超越SQL Server?
- Scrollto and scrollby
- ESP32 LVGL8. 1 - img picture (IMG 20)
- Go language GUI framework Fyne Chinese garbled or not displayed
- 腾讯云GPU最佳实践-使用jupyter pycharm远程开发训练
- SSDB基础3
- c1000k TCP 连接上限测试
- Esp32 (UART event) - serial port event learning (1)
- ESP32 LVGL8. 1 - arc (arc 19)
猜你喜欢
网络协议之:sctp流控制传输协议
Simplified path (force buckle 71)
Getting started with vcpkg
Esp32 (UART ecoh) - serial port echo worm learning (2)
Practice of Druid SQL and security in meituan review
ESP32 LVGL8. 1 - checkbox (checkbox 23)
Eight bit binary multiplier VHDL
Chondroitin sulfate in vitreous
Introduction to ROS learning notes (I)
Keysight has chosen what equipment to buy for you
随机推荐
Go language GUI framework Fyne Chinese garbled or not displayed
Wechat video extraction and receiving file path
ESP32 LVGL8. 1. Detailed migration tutorial of m5stack + lvgl + IDF (27)
#yyds干货盘点#stringprep --- 因特网字符串预备
[报告] Microsoft :Application of deep learning methods in speech enhancement
Get a list of recent apps
高层次人才一站式服务平台开发 人才综合服务平台系统
剑指 Offer II 116. 省份数量-空间复杂度O(n),时间复杂度O(n)
SSDB基础1
Switching power supply design sharing and power supply design skills diagram
Sentinel规则持久化进Nacos
An 8266 crash
SQL常用的命令
C: generic reflection
One of the reasons why the WebView web page cannot be opened (and some WebView problem records encountered by myself)
MySQL restores or rolls back data through binlog
Nacos作为服务配置中心实战
Use bitnami / PostgreSQL repmgr image to quickly set up PostgreSQL ha
Practice of Druid SQL and security in meituan review
Client interns of a large factory share their experience face to face