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
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
| (function (window, mars3d) {
| //创建widget类，需要继承BaseWidget
| class MyWidget extends mars3d.widget.BaseWidget {
| //外部资源配置
| get resources() {
| return ["map.css", "js/Typhoon.js"];
| }
| //弹窗配置
| get view() {
| return {
| type: "window",
| url: "view.html",
| windowOptions: {
| width: 320,
| position: {
| top: 50,
| bottom: 30,
| right: 10,
| },
| },
| };
| }
|
| //初始化[仅执行1次]
| create() {
| var graphicLayer = new mars3d.layer.GraphicLayer();
| this.map.addLayer(graphicLayer);
| this.graphicLayer = graphicLayer;
| }
| //每个窗口创建完成后调用
| winCreateOK(opt, result) {
| this.viewWindow = result;
| }
| //打开激活
| activate() {
| this.graphicLayer.show = true;
| //绘制24/48小时警戒线
| this.drawWarningLine();
| }
| //关闭释放
| disable() {
| this.graphicLayer.show = false;
|
| for (var key in this.viewWindow.typhoonListObj) {
| let typhoon = this.viewWindow.typhoonListObj[key];
| if (typhoon.playTyphoon) {
| typhoon.playTyphoon.stop();
| typhoon.playTyphoon.destroy();
| }
| typhoon.destroy();
| }
| this.viewWindow = null;
| }
| createTyphoon(options) {
| let typhoon = new Typhoon(options, this.map);
| return typhoon;
| }
| startTyphoon(selectTF) {
| selectTF.playTyphoon = selectTF.playTyphoon || new PlayTyphoon(selectTF.options, this.map);
| selectTF.playTyphoon.start();
| selectTF.show = false;
| }
| stopTyphoon(selectTF) {
| if (selectTF?.playTyphoon) {
| selectTF.playTyphoon.stop();
| selectTF.show = true;
| }
| }
|
| //绘制警戒线
| drawWarningLine() {
| //绘制24小时警戒线
| let lineWarning24 = new mars3d.graphic.PolylineEntity({
| positions: [
| [127, 34],
| [127, 22],
| [119, 18],
| [119, 11],
| [113, 4.5],
| [105, 0],
| ],
| style: {
| color: "#828314",
| width: 2,
| zIndex: 1,
| },
| });
| this.graphicLayer.addGraphic(lineWarning24);
|
| //注记文本
| var textWarning24 = new mars3d.graphic.RectangleEntity({
| positions: [
| [128.129019, 29.104287],
| [125.850451, 28.424599],
| ],
| style: {
| material: mars3d.MaterialUtil.createMaterialProperty(mars3d.MaterialType.Text, {
| text: "24小时警戒线",
| font: "80px 楷体",
| color: "#828314",
| backgroundColor: new Cesium.Color(0.0, 0.0, 0.0, 0),
| }),
| rotationDegree: 90,
| zIndex: 2,
| },
| });
| this.graphicLayer.addGraphic(textWarning24);
|
| //绘制48小时警戒线
| let lineWarning48 = new mars3d.graphic.PolylineEntity({
| positions: [
| [132, 34],
| [132, 22],
| [119, 0],
| [105, 0],
| ],
| style: {
| width: 2,
| material: mars3d.MaterialUtil.createMaterialProperty(mars3d.MaterialType.PolylineDash, {
| dashLength: 20.0,
| color: "#4dba3d",
| }),
| zIndex: 1,
| },
| });
| this.graphicLayer.addGraphic(lineWarning48);
|
| //注记文本
| var textWarning48 = new mars3d.graphic.RectangleEntity({
| positions: [
| [130.502492, 25.959716],
| [133.423638, 26.772991],
| ],
| style: {
| material: mars3d.MaterialUtil.createMaterialProperty(mars3d.MaterialType.Text, {
| text: "48小时警戒线",
| font: "80px 楷体",
| color: "#4dba3d",
| backgroundColor: new Cesium.Color(0.0, 0.0, 0.0, 0),
| }),
| rotationDegree: 90,
| zIndex: 4,
| },
| });
| this.graphicLayer.addGraphic(textWarning48);
| }
| }
|
| //注册到widget管理器中。
| mars3d.widget.bindClass(MyWidget);
|
| //每个widet之间都是直接引入到index.html中，会存在彼此命名冲突，所以闭包处理下。
| })(window, mars3d);
|
|
