1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
| (function (window, mars3d) {
| //创建widget类，需要继承BaseWidget
| class MyWidget extends mars3d.widget.BaseWidget {
| //弹窗配置
| get view() {
| return {
| type: "append",
| url: "view.html",
| };
| }
|
| //初始化[仅执行1次]
| create() {}
| //每个窗口创建完成后调用
| winCreateOK(opt, result) {
| //此处可以绑定页面dom事件
| opt._dom.children().attr("src", this.path + "img/heatmap-tuli.png");
| }
| //打开激活
| activate() {
| this._last_basemap = this.map.basemap?.uuid;
| this.map.basemap = 2017; //切换底图到深色底图
|
| // 视角切换（分步执行）
| this.map.setCameraViewList([
| { y: 31.816012, x: 117.229387, z: 786.55, heading: 11.2, pitch: -15.4, roll: 0 },
| { y: 31.814115, x: 117.241232, z: 2344.97, heading: 346.3, pitch: -42.2, roll: 359.9 },
| { y: 31.831903, x: 117.256958, z: 789.61, heading: 284.2, pitch: -18.2, roll: 359.8 },
| ]);
|
| //测试点数据，实际开发时换掉
| var arrPoints = getRandomPoints(1000);
|
| //热力图 图层
| var heatLayer = new mars3d.layer.HeatLayer({
| positions: arrPoints,
| //以下为热力图本身的样式参数，可参阅api：https://www.patrick-wied.at/static/heatmapjs/docs.html
| heatStyle: {
| radius: 60,
| blur: 0.85,
| },
| //以下为矩形矢量对象的样式参数
| style: {
| arc: true, //是否为曲面
| height: 100.0,
| },
| // flyTo: true,
| name: this.config.name,
| pid: 99, //图层管理 中使用，父节点id
| });
| this.map.addLayer(heatLayer);
|
| this.heatLayer = heatLayer;
| }
| //关闭释放
| disable() {
| this.map.cancelFlight();
|
| if (this._last_basemap) {
| this.map.basemap = this._last_basemap; //还原底图
| this._last_basemap = null;
| }
|
| if (this.heatLayer) {
| this.map.removeLayer(this.heatLayer, true);
| this.heatLayer = null;
| }
| }
| }
|
| //注册到widget管理器中。
| mars3d.widget.bindClass(MyWidget);
|
| //获取bbox矩形区域内的count个随机点
| function getRandomPoints(count) {
| var xmin = 117.226189,
| xmax = 117.245831,
| ymin = 31.828858,
| ymax = 31.842967;
| var arr = [];
| var arrPoint = turf.randomPoint(count, { bbox: [xmin, ymin, xmax, ymax] }).features; //随机点
| for (var i = 0; i < arrPoint.length; i++) {
| var item = arrPoint[i].geometry.coordinates;
| var val = Math.floor(Math.random() * 100); //热力值
| arr.push({ lng: item[0], lat: item[1], value: val });
| }
| return arr;
| }
|
| //每个widet之间都是直接引入到index.html中，会存在彼此命名冲突，所以闭包处理下。
| })(window, mars3d);
|
|
