openatc-components 0.1.52 → 0.1.54

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/package/kisscomps/components/ChannelizationWithInterface/ChannelizationWithInterface.vue +4 -4
  2. package/package/kisscomps/components/IntersectionMap/crossDirection/crossDiagram.vue +5 -5
  3. package/package/kisscomps/components/IntersectionMap/crossDirection/posJson/sidePos.json +72 -0
  4. package/package/kisscomps/components/IntersectionMap/intersectionmap.vue +4 -5
  5. package/package/kisscomps/components/IntersectionWithInterface/IntersectionWithInterface.vue +5 -6
  6. package/package/kisscomps/components/PatternStatus/PatternStatus.vue +51 -34
  7. package/package/kisscomps/components/SchemeConfig/SchemeConfig.vue +4 -5
  8. package/package/kisscomps/components/SchemeConfig/realtimeStatusModal/index.vue +5 -5
  9. package/package/kisscomps/components/XRDDirSelector/XRDDirSelector.vue +829 -564
  10. package/package/kisscomps/components/overView/index.vue +5 -7
  11. package/package/kissui.min.js +1 -1
  12. package/package.json +1 -1
  13. package/src/kisscomps/components/ChannelizationWithInterface/ChannelizationWithInterface.vue +4 -4
  14. package/src/kisscomps/components/IntersectionMap/crossDirection/crossDiagram.vue +5 -5
  15. package/src/kisscomps/components/IntersectionMap/crossDirection/posJson/sidePos.json +72 -0
  16. package/src/kisscomps/components/IntersectionMap/intersectionmap.vue +4 -5
  17. package/src/kisscomps/components/IntersectionWithInterface/IntersectionWithInterface.vue +5 -6
  18. package/src/kisscomps/components/PatternStatus/PatternStatus.vue +51 -34
  19. package/src/kisscomps/components/SchemeConfig/SchemeConfig.vue +4 -5
  20. package/src/kisscomps/components/SchemeConfig/realtimeStatusModal/index.vue +5 -5
  21. package/src/kisscomps/components/XRDDirSelector/XRDDirSelector.vue +829 -564
  22. package/src/kisscomps/components/overView/index.vue +5 -7
  23. package/src/node_modules/.package_versions.json +1 -0
  24. package/src/utils/RingDataModel.js +14 -9
package/src/kisscomps/components/XRDDirSelector/XRDDirSelector.vue CHANGED
@@ -10,560 +10,659 @@
10
10
  * See the Mulan PSL v2 for more details.
11
11
  **/
12
12
  <template>
13
- <div :style="{position: 'reletive'}">
14
- <!-- <div> -->
15
- <div :style="{position: 'absolute', left: Data?Data.left:0, top: Data?Data.top:0}">
16
- <svg
17
- t="1545378648902"
18
- class="icon"
19
- viewBox="0 0 50 50"
20
- style="enable-background:new 0 0 50 50;"
21
- version="1.1"
22
- xmlns="http://www.w3.org/2000/svg"
23
- p-id="6773"
24
- xmlns:xlink="http://www.w3.org/1999/xlink"
25
- :width="Width"
26
- :height="Height"
27
- >
28
- <!-- <mask id="shade"> -->
29
- <path
30
- d="M893.44 158.72
31
- H130.56C99.84 158.72 76.8 181.76 76.8 212.48v599.04c0 30.72 23.04 53.76 53.76 53.76
32
- h762.88c30.72 0 53.76-23.04 53.76-53.76V212.48c0-30.72-23.04-53.76-53.76-53.76z
33
- M130.56 194.56
34
- h762.88c10.24 0 17.92 7.68 17.92 17.92
35
- v537.6l-209.92-189.44-171.52 143.36-245.76-209.92-171.52 186.88
36
- V212.48c0-10.24 7.68-17.92 17.92-17.92z
37
- m-17.92 616.96v-76.8l174.08-189.44 332.8 284.16
38
- H130.56c-10.24 0-17.92-7.68-17.92-17.92z
39
- m780.8 17.92
40
- h-217.6l-120.32-102.4 143.36-120.32 209.92 189.44v12.8c2.56 12.8-5.12 20.48-15.36 20.48z"
41
- :fill="MaskColor"
42
- p-id="2761"
43
- :class="maskmark ? '' : 'invisible'"
44
- ></path>
45
- <path
46
- d="M668.16 463.36c56.32 0 104.96-46.08 104.96-104.96 0-56.32-46.08-104.96-104.96-104.96S563.2 302.08 563.2 358.4c0 56.32 46.08 104.96 104.96 104.96z"
47
- :fill="MaskColor"
48
- p-id="2762"
49
- :class="maskmark ? '' : 'invisible'"
50
- ></path>
51
- <!-- </mask> -->
52
- <!-- <mask id="shade"> -->
53
- <!-- ====================================右行相位图标合集============================================= -->
54
- <g id="右行" v-if="roadDirection === 'right'">
55
- <path
56
- id="西左转_3_"
57
- :stroke-width="PathWidth"
58
- :fill="status[5].color"
59
- :class="status[5].isshow ? '' : 'invisible'"
60
- d="M17.3,36.3H1.4v2h16c2.1,0,3.8-1.7,3.9-3.8l0.3-1.9l2.5,0.3l-2.6-6.4l-4.3,5.4l2.5,0.3
61
- l-0.3,2.2C19.2,35.5,18.4,36.3,17.3,36.3L17.3,36.3z"
62
- ></path>
63
- <path
64
- id="西右转"
65
- :stroke-width="PathWidth"
66
- :fill="status[6].color"
67
- :class="status[6].isshow ? '' : 'invisible'"
68
- d="M17.3,38.3c1.1,0,1.9,0.8,2.1,1.9l0.3,2.2l-2.5,0.3l4.3,5.4l2.6-6.4L21.6,42l-0.3-1.9
69
- c-0.1-2.1-1.8-3.8-3.9-3.8h-16v2H17.3L17.3,38.3z"
70
- ></path>
71
- <polygon
72
- id="西直行_1_"
73
- :stroke-width="PathWidth"
74
- :fill="status[4].color"
75
- :class="status[4].isshow ? '' : 'invisible'"
76
- points="1.4,38.3 24.6,38.3 24.6,40.8 30.7,37.3 24.6,33.9 24.6,36.3 1.4,36.3"
77
- ></polygon>
78
- <path
79
- id="西调头_1_"
80
- :stroke-width="PathWidth"
81
- :fill="status[7].color"
82
- :class="status[7].isshow ? '' : 'invisible'"
83
- d="M11.8,29.2H8.9v-2.4l-6,3.5l6,3.5v-2.5h2.9c1,0,1.9,1.1,1.9,2.5c0,1.3-0.9,2.5-1.9,2.5H1.4
84
- v2h10.4c2.1,0,3.9-2,3.9-4.5C15.6,31.2,13.9,29.2,11.8,29.2z"
85
- ></path>
86
- <path
87
- id="南左转_1_"
88
- :stroke-width="PathWidth"
89
- :fill="status[13].color"
90
- :class="status[13].isshow ? '' : 'invisible'"
91
- d="M36.8,34.1V50h2V34c0-2.1-1.7-3.8-3.8-3.9l-1.9-0.3l0.3-2.5L27,30l5.4,4.3l0.3-2.5l2.2,0.3
92
- C35.9,32.2,36.8,33,36.8,34.1L36.8,34.1z"
93
- ></path>
94
- <path
95
- id="南右转_1_"
96
- :stroke-width="PathWidth"
97
- :fill="status[14].color"
98
- :class="status[14].isshow ? '' : 'invisible'"
99
- d="M40.9,32l2-0.3l0.3,2.5l5.4-4.3l-6.4-2.6l0.3,2.5l-1.9,0.3c-2.1,0-3.8,1.7-3.8,3.9v16h2
100
- V33.9c0-1,0.9-1.9,1.9-1.9H40.9z"
101
- ></path>
102
- <polygon
103
- id="南直行_1_"
104
- :stroke-width="PathWidth"
105
- :fill="status[12].color"
106
- :class="status[12].isshow ? '' : 'invisible'"
107
- points="38.8,50 38.8,26.8 41.2,26.8 37.8,20.7 34.3,26.8 36.8,26.8 36.8,50"
108
- ></polygon>
109
- <path
110
- id="南调头_1_"
111
- :stroke-width="PathWidth"
112
- :fill="status[15].color"
113
- :class="status[15].isshow ? '' : 'invisible'"
114
- d="M29.8,39.6v2.9h-2.5l3.5,6l3.5-6h-2.5v-2.9c0-1,1.1-1.9,2.5-1.9c1.3,0,2.5,0.9,2.5,1.9V50h2
115
- V39.6c0-2.1-2-3.9-4.5-3.9C31.8,35.8,29.8,37.5,29.8,39.6z"
116
- ></path>
117
- <path
118
- id="东左转_3_"
119
- :stroke-width="PathWidth"
120
- :fill="status[1].color"
121
- :class="status[1].isshow ? '' : 'invisible'"
122
- d="M32.7,13.7h15.9v-2h-16c-2.1,0-3.8,1.7-3.9,3.8l-0.3,1.9L26,17.1l2.6,6.4l4.3-5.4l-2.5-0.3
123
- l0.3-2.2C30.8,14.5,31.6,13.7,32.7,13.7L32.7,13.7z"
124
- ></path>
125
- <path
126
- id="东右转"
127
- :stroke-width="PathWidth"
128
- :fill="status[2].color"
129
- :class="status[2].isshow ? '' : 'invisible'"
130
- d="M32.7,11.7c-1.1,0-1.9-0.8-2-1.9l-0.3-2.2l2.5-0.3l-4.3-5.4L26,8.3L28.4,8l0.3,1.9
131
- c0.1,2.1,1.8,3.8,3.9,3.8h16v-2H32.7L32.7,11.7z"
132
- ></path>
133
- <polygon
134
- id="东直行_1_"
135
- :stroke-width="PathWidth"
136
- :fill="status[0].color"
137
- :class="status[0].isshow ? '' : 'invisible'"
138
- points="48.6,11.7 25.4,11.7 25.4,9.2 19.3,12.7 25.4,16.1 25.4,13.7 48.6,13.7"
139
- ></polygon>
140
- <path
141
- id="东调头_1_"
142
- :stroke-width="PathWidth"
143
- :fill="status[3].color"
144
- :class="status[3].isshow ? '' : 'invisible'"
145
- d="M38.2,20.8h2.9v2.4l6-3.5l-6-3.5v2.5h-2.9c-1,0-1.9-1.1-1.9-2.5c0-1.3,0.9-2.5,1.9-2.5h10.4
146
- v-2H38.2c-2.1,0-3.9,2-3.9,4.5S36.1,20.8,38.2,20.8z"
147
- ></path>
148
- <path
149
- id="北左转_1_"
150
- :stroke-width="PathWidth"
151
- :fill="status[9].color"
152
- :class="status[9].isshow ? '' : 'invisible'"
153
- d="M13.2,15.9V0l-2,0v16c0,2.1,1.7,3.8,3.8,3.9l1.9,0.3l-0.3,2.5L23,20l-5.4-4.3l-0.3,2.5
154
- l-2.2-0.3C14.1,17.8,13.2,17,13.2,15.9L13.2,15.9z"
155
- ></path>
156
- <path
157
- id="北右转_1_"
158
- :stroke-width="PathWidth"
159
- :fill="status[10].color"
160
- :class="status[10].isshow ? '' : 'invisible'"
161
- d="M9.2,17.9l-2,0.3l-0.3-2.5L1.4,20l6.4,2.6l-0.3-2.5l1.9-0.3c2.1,0,3.8-1.7,3.8-3.9V0l-2,0
162
- v16c0,1-0.9,1.9-1.9,1.9C9.3,17.9,9.2,17.9,9.2,17.9z"
163
- ></path>
164
- <polygon
165
- id="北直行_1_"
166
- :stroke-width="PathWidth"
167
- :fill="status[8].color"
168
- :class="status[8].isshow ? '' : 'invisible'"
169
- points="11.2,0 11.2,23.2 8.8,23.2 12.2,29.3 15.7,23.2 13.2,23.2 13.2,0"
170
- ></polygon>
171
- <path
172
- id="北调头_1_"
173
- :stroke-width="PathWidth"
174
- :fill="status[11].color"
175
- :class="status[11].isshow ? '' : 'invisible'"
176
- d="M20.2,10.4V7.5h2.5l-3.5-6l-3.5,6h2.5v2.9c0,1-1.1,1.9-2.5,1.9s-2.5-0.9-2.5-1.9V0l-2,0
177
- v10.4c0,2.1,2,3.9,4.5,3.9C18.2,14.2,20.2,12.5,20.2,10.4z"
178
- ></path>
179
- </g>
180
-
181
- <!-- ====================================左行相位图标合集============================================= -->
182
- <g id="组-左行" v-if="roadDirection === 'left'">
183
- <path
184
- id="东右转-左行"
185
- :stroke-width="PathWidth"
186
- :fill="status[2].color"
187
- :class="status[2].isshow ? '' : 'invisible'"
188
- d="M32.7,36.3c-1.1,0-1.9-0.8-2.1-1.9l-0.3-2.2l2.5-0.3l-4.3-5.4l-2.6,6.4l2.5-0.3l0.3,1.9
189
- c0.1,2.1,1.8,3.8,3.9,3.8h16v-2H32.7L32.7,36.3z"
190
- ></path>
191
- <path
192
- id="东左转-左行"
193
- :stroke-width="PathWidth"
194
- :fill="status[1].color"
195
- :class="status[1].isshow ? '' : 'invisible'"
196
- d="M32.7,38.3h15.9v-2h-16c-2.1,0-3.8,1.7-3.9,3.8L28.4,42l-2.5-0.3l2.6,6.4l4.3-5.4
197
- l-2.5-0.3l0.3-2.2C30.8,39.1,31.6,38.3,32.7,38.3L32.7,38.3z"
198
- ></path>
199
- <polygon
200
- id="东直行-左行"
201
- :stroke-width="PathWidth"
202
- :fill="status[0].color"
203
- :class="status[0].isshow ? '' : 'invisible'"
204
- points="48.6,36.3 25.4,36.3 25.4,33.9 19.3,37.3 25.4,40.8 25.4,38.3 48.6,38.3"
205
- ></polygon>
206
- <path
207
- id="东调头-左行"
208
- class="st0"
209
- :stroke-width="PathWidth"
210
- :fill="status[3].color"
211
- :class="status[3].isshow ? '' : 'invisible'"
212
- d="M34.3,33.8c0,2.5,1.8,4.5,3.9,4.5h10.4v-2H38.2c-1,0-1.9-1.2-1.9-2.5
213
- c0-1.4,0.9-2.5,1.9-2.5h2.9v2.5l6-3.5l-6-3.5v2.4h-2.9C36.1,29.2,34.4,31.2,34.3,33.8z"
214
- ></path>
215
- <path
216
- id="南左转-左行"
217
- :stroke-width="PathWidth"
218
- :fill="status[13].color"
219
- :class="status[13].isshow ? '' : 'invisible'"
220
- d="M9.3,32c1,0,1.9,0.9,1.9,1.9V50h2V34c0-2.2-1.7-3.9-3.8-3.9l-1.9-0.3l0.3-2.5l-6.4,2.6
221
- l5.4,4.3l0.3-2.5l2,0.3H9.3z"
222
- ></path>
223
- <path
224
- id="南右转-左行"
225
- :stroke-width="PathWidth"
226
- :fill="status[14].color"
227
- :class="status[14].isshow ? '' : 'invisible'"
228
- d="M13.2,34.1c0-1.1,0.9-1.9,1.9-2l2.2-0.3l0.3,2.5L23,30l-6.4-2.7l0.3,2.5L15,30.1
229
- c-2.1,0.1-3.8,1.8-3.8,3.9v16h2V34.1L13.2,34.1z"
230
- ></path>
231
- <polygon
232
- id="南直行-左行"
233
- :stroke-width="PathWidth"
234
- :fill="status[12].color"
235
- :class="status[12].isshow ? '' : 'invisible'"
236
- points="13.2,50 13.2,26.8 15.7,26.8 12.2,20.7 8.8,26.8 11.2,26.8 11.2,50"
237
- ></polygon>
238
- <path
239
- id="南调头-左行"
240
- :stroke-width="PathWidth"
241
- :fill="status[15].color"
242
- :class="status[15].isshow ? '' : 'invisible'"
243
- d="M15.7,35.7c-2.5,0-4.5,1.8-4.5,3.9V50h2V39.6c0-1,1.2-1.9,2.5-1.9
244
- c1.4,0,2.5,0.9,2.5,1.9v2.9h-2.5l3.5,6l3.5-6h-2.5v-2.9C20.2,37.5,18.2,35.8,15.7,35.7z"
245
- ></path>
246
- <path
247
- id="西右转-左行"
248
- :stroke-width="PathWidth"
249
- :fill="status[6].color"
250
- :class="status[6].isshow ? '' : 'invisible'"
251
- d="M17.3,13.7c1.1,0,1.9,0.8,2,1.9l0.3,2.2l-2.5,0.3l4.3,5.4l2.6-6.4l-2.4,0.3l-0.3-1.9
252
- c-0.1-2.1-1.8-3.8-3.9-3.8h-16v2L17.3,13.7L17.3,13.7z"
253
- ></path>
254
- <path
255
- id="西左转-左行"
256
- :stroke-width="PathWidth"
257
- :fill="status[5].color"
258
- :class="status[5].isshow ? '' : 'invisible'"
259
- d="M17.3,11.7H1.4v2h16c2.1,0,3.8-1.7,3.9-3.8L21.6,8L24,8.3l-2.6-6.4l-4.3,5.4l2.5,0.3
260
- l-0.3,2.2C19.2,10.9,18.4,11.7,17.3,11.7L17.3,11.7z"
261
- ></path>
262
- <polygon
263
- id="西直行-左行"
264
- :stroke-width="PathWidth"
265
- :fill="status[4].color"
266
- :class="status[4].isshow ? '' : 'invisible'"
267
- points="1.4,13.7 24.6,13.7 24.6,16.1 30.7,12.7 24.6,9.2 24.6,11.7 1.4,11.7"
268
- ></polygon>
269
- <path
270
- id="西调头-左行"
271
- :stroke-width="PathWidth"
272
- :fill="status[7].color"
273
- :class="status[7].isshow ? '' : 'invisible'"
274
- d="M15.7,16.2c0-2.5-1.8-4.5-3.9-4.5H1.4v2h10.4c1,0,1.9,1.2,1.9,2.5
275
- c0,1.4-0.9,2.5-1.9,2.5H8.9v-2.5l-6,3.5l6,3.5v-2.4h2.9C13.9,20.8,15.7,18.7,15.7,16.2z"
276
- ></path>
277
- <path
278
- id="北左转-左行"
279
- :stroke-width="PathWidth"
280
- :fill="status[9].color"
281
- :class="status[9].isshow ? '' : 'invisible'"
282
- d="M40.7,17.9c-1,0-1.9-0.9-1.9-1.9V0h-2v15.9c0,2.2,1.7,3.9,3.8,3.9l1.9,0.3l-0.3,2.5
283
- l6.4-2.6l-5.5-4.3l-0.3,2.5l-2-0.3C40.8,17.9,40.7,17.9,40.7,17.9z"
284
- ></path>
285
- <path
286
- id="北右转-左行"
287
- :stroke-width="PathWidth"
288
- :fill="status[10].color"
289
- :class="status[10].isshow ? '' : 'invisible'"
290
- d="M36.8,15.9c0,1.1-0.9,1.9-1.9,2l-2.2,0.3l-0.3-2.5L27,20l6.4,2.7l-0.3-2.5l1.9-0.3
291
- c2.1-0.1,3.8-1.8,3.8-3.9V0h-2L36.8,15.9L36.8,15.9z"
292
- ></path>
293
- <polygon
294
- id="北直行-左行"
295
- :stroke-width="PathWidth"
296
- :fill="status[8].color"
297
- :class="status[8].isshow ? '' : 'invisible'"
298
- points="36.8,0 36.8,23.2 34.3,23.2 37.8,29.3 41.2,23.2 38.8,23.2 38.8,0"
299
- ></polygon>
300
- <path
301
- id="北调头-左行"
302
- :stroke-width="PathWidth"
303
- :fill="status[11].color"
304
- :class="status[11].isshow ? '' : 'invisible'"
305
- d="M34.3,14.3c2.5,0,4.5-1.8,4.5-3.9V0h-2v10.4c0,1-1.1,1.9-2.5,1.9s-2.5-0.9-2.5-1.9V7.5
306
- h2.5l-3.5-6l-3.5,6h2.5v2.9C29.8,12.5,31.8,14.2,34.3,14.3z"
307
- ></path>
308
- </g>
309
- </svg>
310
- </div>
311
- <div :style="{position: 'absolute', left: Data?Data.left:0, top: Data?Data.top:0}">
312
- <svg
313
- :width="Width"
314
- :height="Height"
315
- version="1.1"
316
- id="图层_1"
317
- xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
318
- viewBox="0 0 34 34"
319
- style="enable-background:new 0 0 34 34;"
320
- xml:space="preserve">
321
- <g id="路段行人过街-东西"
322
- :class="peoplestatus[0].isshow? '' : 'invisible'">
323
- <rect x="19.9" y="14.2" class="st1" width="1.6" height="5.6"/>
324
- <rect x="17.4" y="14.2" class="st1" width="1.6" height="5.6"/>
325
- <rect x="22.4" y="14.2" class="st1" width="1.6" height="5.6"/>
326
- <rect x="24.9" y="14.2" class="st1" width="1.6" height="5.6"/>
327
- <rect x="27.4" y="14.2" class="st1" width="1.6" height="5.6"/>
328
- <rect x="29.9" y="14.2" class="st1" width="1.6" height="5.6"/>
329
- <rect x="32.4" y="14.2" class="st1" width="1.6" height="5.6"/>
330
- <rect x="7.5" y="14.2" class="st1" width="1.6" height="5.6"/>
331
- <rect x="5" y="14.2" class="st1" width="1.6" height="5.6"/>
332
- <rect x="2.5" y="14.2" class="st1" width="1.6" height="5.6"/>
333
- <rect x="0" y="14.2" class="st1" width="1.6" height="5.6"/>
334
- <rect x="10" y="14.2" class="st1" width="1.6" height="5.6"/>
335
- <rect x="12.5" y="14.2" class="st1" width="1.6" height="5.6"/>
336
- <rect x="14.9" y="14.2" class="st1" width="1.6" height="5.6"/>
337
- </g>
338
- <g id="路段行人过街-南北" class="st0"
339
- :class="peoplestatus[1].isshow? '' : 'invisible'">
340
- >
341
- <rect x="14.2" y="19.9" class="st1" width="5.6" height="1.6"/>
342
- <rect x="14.2" y="17.4" class="st1" width="5.6" height="1.6"/>
343
- <rect x="14.2" y="22.4" class="st1" width="5.6" height="1.6"/>
344
- <rect x="14.2" y="24.9" class="st1" width="5.6" height="1.6"/>
345
- <rect x="14.2" y="27.4" class="st1" width="5.6" height="1.6"/>
346
- <rect x="14.2" y="29.9" class="st1" width="5.6" height="1.6"/>
347
- <rect x="14.2" y="32.4" class="st1" width="5.6" height="1.6"/>
348
- <rect x="14.2" y="7.5" class="st1" width="5.6" height="1.6"/>
349
- <rect x="14.2" y="5" class="st1" width="5.6" height="1.6"/>
350
- <rect x="14.2" y="2.5" class="st1" width="5.6" height="1.6"/>
351
- <rect x="14.2" y="0" class="st1" width="5.6" height="1.6"/>
352
- <rect x="14.2" y="10" class="st1" width="5.6" height="1.6"/>
353
- <rect x="14.2" y="12.5" class="st1" width="5.6" height="1.6"/>
354
- <rect x="14.2" y="14.9" class="st1" width="5.6" height="1.6"/>
355
- </g>
356
- <g id="斜向行人1" class="st0"
357
- :class="peoplestatus[2].isshow? '' : 'invisible'">
358
- >
359
- <rect x="14.2" y="16.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.0438 17.0053)" class="st1" width="5.6" height="1.6"/>
360
- <rect x="12.4" y="14.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -6.3149 15.2456)" class="st1" width="5.6" height="1.6"/>
361
- <rect x="15.9" y="17.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.7727 18.7651)" class="st1" width="5.6" height="1.6"/>
362
- <rect x="17.7" y="19.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -8.5017 20.5248)" class="st1" width="5.6" height="1.6"/>
363
- <rect x="19.5" y="21.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -9.2306 22.2845)" class="st1" width="5.6" height="1.6"/>
364
- <rect x="21.2" y="23.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -9.9595 24.0443)" class="st1" width="5.6" height="1.6"/>
365
- <rect x="23" y="25" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -10.6884 25.804)" class="st1" width="5.6" height="1.6"/>
366
- <rect x="24.7" y="26.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -11.4128 27.5531)" class="st1" width="5.6" height="1.6"/>
367
- <rect x="26.5" y="28.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -12.1418 29.3128)" class="st1" width="5.6" height="1.6"/>
368
- <rect x="28.3" y="30.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -12.8707 31.0725)" class="st1" width="5.6" height="1.6"/>
369
- <rect x="5.4" y="7.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -3.3993 8.2067)" class="st1" width="5.6" height="1.6"/>
370
- <rect x="3.6" y="5.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -2.6704 6.4469)" class="st1" width="5.6" height="1.6"/>
371
- <rect x="1.9" y="3.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -1.9415 4.6872)" class="st1" width="5.6" height="1.6"/>
372
- <rect x="0.1" y="2.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -1.2126 2.9275)" class="st1" width="5.6" height="1.6"/>
373
- <rect x="7.1" y="9.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.1282 9.9664)" class="st1" width="5.6" height="1.6"/>
374
- <rect x="8.9" y="10.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.8571 11.7261)" class="st1" width="5.6" height="1.6"/>
375
- <rect x="10.7" y="12.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -5.586 13.4859)" class="st1" width="5.6" height="1.6"/>
376
- </g>
377
- <g id="斜向行人2" class="st0"
378
- :class="peoplestatus[3].isshow? '' : 'invisible'"
379
- >
380
- <rect x="16.2" y="14.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.047 16.9978)" class="st1" width="1.6" height="5.6"/>
381
- <rect x="17.9" y="12.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -5.2872 17.7267)" class="st1" width="1.6" height="5.6"/>
382
- <rect x="14.4" y="15.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -8.8067 16.2689)" class="st1" width="1.6" height="5.6"/>
383
- <rect x="12.7" y="17.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -10.5664 15.54)" class="st1" width="1.6" height="5.6"/>
384
-
385
- <rect x="10.9" y="19.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -12.3262 14.8111)" class="st1" width="1.6" height="5.6"/>
386
- <rect x="9.1" y="21.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -14.0859 14.0822)" class="st1" width="1.6" height="5.6"/>
387
- <rect x="7.4" y="23" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -15.8456 13.3533)" class="st1" width="1.6" height="5.6"/>
388
- <rect x="5.6" y="24.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -17.5947 12.6288)" class="st1" width="1.6" height="5.6"/>
389
- <rect x="3.9" y="26.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -19.3544 11.8999)" class="st1" width="1.6" height="5.6"/>
390
- <rect x="2.1" y="28.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -21.1142 11.171)" class="st1" width="1.6" height="5.6"/>
391
- <rect x="25" y="5.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 1.7517 20.6423)" class="st1" width="1.6" height="5.6"/>
392
- <rect x="26.7" y="3.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 3.5114 21.3712)" class="st1" width="1.6" height="5.6"/>
393
- <rect x="28.5" y="1.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 5.2712 22.1001)" class="st1" width="1.6" height="5.6"/>
394
- <rect x="30.3" y="0.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 7.0309 22.829)" class="st1" width="1.6" height="5.6"/>
395
-
396
- <rect x="23.2" y="7.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -8.040609e-03 19.9134)" class="st1" width="1.6" height="5.6"/>
397
- <rect x="21.5" y="8.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -1.7678 19.1845)" class="st1" width="1.6" height="5.6"/>
398
- <rect x="19.7" y="10.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -3.5275 18.4556)" class="st1" width="1.6" height="5.6"/>
399
- </g>
400
- <g id="北行人"
401
- :class="peoplestatus[4].isshow? '' : 'invisible'"
402
- class="st0">
403
- <rect x="19.9" class="st1" width="1.6" height="5.6"/>
404
- <rect x="17.4" class="st1" width="1.6" height="5.6"/>
405
- <rect x="22.4" class="st1" width="1.6" height="5.6"/>
406
- <rect x="24.9" class="st1" width="1.6" height="5.6"/>
407
- <rect x="27.4" class="st1" width="1.6" height="5.6"/>
408
- <rect x="29.9" class="st1" width="1.6" height="5.6"/>
409
- <rect x="32.4" class="st1" width="1.6" height="5.6"/>
410
- <rect x="7.5" class="st1" width="1.6" height="5.6"/>
411
- <rect x="5" class="st1" width="1.6" height="5.6"/>
412
- <rect x="2.5" class="st1" width="1.6" height="5.6"/>
413
- <rect x="0" class="st1" width="1.6" height="5.6"/>
414
- <rect x="10" class="st1" width="1.6" height="5.6"/>
415
- <rect x="12.5" class="st1" width="1.6" height="5.6"/>
416
- <rect x="14.9" class="st1" width="1.6" height="5.6"/>
417
- </g>
418
- <g id="南行人"
419
- :class="peoplestatus[5].isshow? '' : 'invisible'"
420
- class="st0">
421
- <rect x="19.9" y="28.4" class="st1" width="1.6" height="5.6"/>
422
- <rect x="17.4" y="28.4" class="st1" width="1.6" height="5.6"/>
423
- <rect x="22.4" y="28.4" class="st1" width="1.6" height="5.6"/>
424
- <rect x="24.9" y="28.4" class="st1" width="1.6" height="5.6"/>
425
- <rect x="27.4" y="28.4" class="st1" width="1.6" height="5.6"/>
426
- <rect x="29.9" y="28.4" class="st1" width="1.6" height="5.6"/>
427
- <rect x="32.4" y="28.4" class="st1" width="1.6" height="5.6"/>
428
- <rect x="7.5" y="28.4" class="st1" width="1.6" height="5.6"/>
429
- <rect x="5" y="28.4" class="st1" width="1.6" height="5.6"/>
430
- <rect x="2.5" y="28.4" class="st1" width="1.6" height="5.6"/>
431
- <rect x="0" y="28.4" class="st1" width="1.6" height="5.6"/>
432
- <rect x="10" y="28.4" class="st1" width="1.6" height="5.6"/>
433
- <rect x="12.5" y="28.4" class="st1" width="1.6" height="5.6"/>
434
- <rect x="14.9" y="28.4" class="st1" width="1.6" height="5.6"/>
435
- </g>
436
- <g id="东行人"
437
- :class="peoplestatus[6].isshow? '' : 'invisible'"
438
- class="st0">
439
- <rect x="28.4" y="19.9" class="st1" width="5.6" height="1.6"/>
440
- <rect x="28.4" y="17.4" class="st1" width="5.6" height="1.6"/>
441
- <rect x="28.4" y="22.4" class="st1" width="5.6" height="1.6"/>
442
- <rect x="28.4" y="24.9" class="st1" width="5.6" height="1.6"/>
443
- <rect x="28.4" y="27.4" class="st1" width="5.6" height="1.6"/>
444
- <rect x="28.4" y="29.9" class="st1" width="5.6" height="1.6"/>
445
- <rect x="28.4" y="32.4" class="st1" width="5.6" height="1.6"/>
446
- <rect x="28.4" y="7.5" class="st1" width="5.6" height="1.6"/>
447
- <rect x="28.4" y="5" class="st1" width="5.6" height="1.6"/>
448
- <rect x="28.4" y="2.5" class="st1" width="5.6" height="1.6"/>
449
- <rect x="28.4" y="0" class="st1" width="5.6" height="1.6"/>
450
- <rect x="28.4" y="10" class="st1" width="5.6" height="1.6"/>
451
- <rect x="28.4" y="12.5" class="st1" width="5.6" height="1.6"/>
452
- <rect x="28.4" y="14.9" class="st1" width="5.6" height="1.6"/>
453
- </g>
454
- <g id="西行人"
455
- :class="peoplestatus[7].isshow? '' : 'invisible'"
456
- class="st0">
457
- <rect y="19.9" class="st1" width="5.6" height="1.6"/>
458
- <rect y="17.4" class="st1" width="5.6" height="1.6"/>
459
- <rect y="22.4" class="st1" width="5.6" height="1.6"/>
460
- <rect y="24.9" class="st1" width="5.6" height="1.6"/>
461
- <rect y="27.4" class="st1" width="5.6" height="1.6"/>
462
- <rect y="29.9" class="st1" width="5.6" height="1.6"/>
463
- <rect y="32.4" class="st1" width="5.6" height="1.6"/>
464
- <rect y="7.5" class="st1" width="5.6" height="1.6"/>
465
- <rect y="5" class="st1" width="5.6" height="1.6"/>
466
- <rect y="2.5" class="st1" width="5.6" height="1.6"/>
467
- <rect y="0" class="st1" width="5.6" height="1.6"/>
468
- <rect y="10" class="st1" width="5.6" height="1.6"/>
469
- <rect y="12.5" class="st1" width="5.6" height="1.6"/>
470
- <rect y="14.9" class="st1" width="5.6" height="1.6"/>
471
- </g>
472
- <g id="二次过街-西" class="st0">
473
- <g id="西下"
474
- :class="peoplestatus[8].isshow? '' : 'invisible'"
475
- >
476
- <rect y="19.9" class="st1" width="5.6" height="1.6"/>
477
- <rect y="22.4" class="st1" width="5.6" height="1.6"/>
478
- <rect y="24.9" class="st1" width="5.6" height="1.6"/>
479
- <rect y="27.4" class="st1" width="5.6" height="1.6"/>
480
- <rect y="29.9" class="st1" width="5.6" height="1.6"/>
481
- <rect y="32.4" class="st1" width="5.6" height="1.6"/>
482
- </g>
483
- <g id="西上"
484
- :class="peoplestatus[9].isshow? '' : 'invisible'"
485
- >
486
- <rect y="7.5" class="st1" width="5.6" height="1.6"/>
487
- <rect y="5" class="st1" width="5.6" height="1.6"/>
488
- <rect y="2.5" class="st1" width="5.6" height="1.6"/>
489
- <rect y="0" class="st1" width="5.6" height="1.6"/>
490
- <rect y="10" class="st1" width="5.6" height="1.6"/>
491
- <rect y="12.5" class="st1" width="5.6" height="1.6"/>
492
- </g>
493
- </g>
494
- <g id="二次过街-东" class="st0">
495
- <g id="东上"
496
- :class="peoplestatus[10].isshow? '' : 'invisible'"
497
- >
498
- <rect x="28.4" y="12.5" class="st1" width="5.6" height="1.6"/>
499
- <rect x="28.4" y="10" class="st1" width="5.6" height="1.6"/>
500
- <rect x="28.4" y="7.5" class="st1" width="5.6" height="1.6"/>
501
- <rect x="28.4" y="5" class="st1" width="5.6" height="1.6"/>
502
- <rect x="28.4" y="2.5" class="st1" width="5.6" height="1.6"/>
503
- <rect x="28.4" y="0" class="st1" width="5.6" height="1.6"/>
504
- </g>
505
- <g id="东下"
506
- :class="peoplestatus[11].isshow? '' : 'invisible'"
507
- >
508
- <rect x="28.4" y="24.9" class="st1" width="5.6" height="1.6"/>
509
- <rect x="28.4" y="27.4" class="st1" width="5.6" height="1.6"/>
510
- <rect x="28.4" y="29.9" class="st1" width="5.6" height="1.6"/>
511
- <rect x="28.4" y="32.4" class="st1" width="5.6" height="1.6"/>
512
- <rect x="28.4" y="22.4" class="st1" width="5.6" height="1.6"/>
513
- <rect x="28.4" y="19.9" class="st1" width="5.6" height="1.6"/>
514
- </g>
515
- </g>
516
- <g id="二次过街-南" class="st0">
517
- <g id="南右"
518
- :class="peoplestatus[12].isshow? '' : 'invisible'"
13
+ <div :style="{position: 'reletive'}">
14
+ <div :style="{position: 'absolute', left: Data?Data.left:0, top: Data?Data.top:0}">
15
+ <svg
16
+ version="1.1"
17
+ id="图层_1"
18
+ xmlns="http://www.w3.org/2000/svg"
19
+ xmlns:xlink="http://www.w3.org/1999/xlink"
20
+ :width="Width"
21
+ :height="Height"
22
+ viewBox="0 0 60 60"
23
+ style="enable-background:new 0 0 60 60;"
24
+ xml:space="preserve">
25
+ <g>
26
+ <path
27
+ id="西北左转"
28
+ :stroke-width="PathWidth"
29
+ :fill="status[29].color"
30
+ :class="status[29].isshow ? '' : 'invisible'"
31
+ d="M14.6,30.5L3.3,19.3l-1.4,1.4L13.2,32c1.5,1.5,3.9,1.5,5.4,0.1l1.6-1.1l1.6,2l2.7-6.4l-6.9,0.8l1.6,2l-1.8,1.3C16.5,31.3,15.3,31.3,14.6,30.5L14.6,30.5z">
32
+ </path>
33
+ <path
34
+ id="西北右转"
35
+ :stroke-width="PathWidth"
36
+ :fill="status[30].color"
37
+ :class="status[30].isshow ? '' : 'invisible'"
38
+ d="M13.2,32c0.8,0.8,0.8,1.9,0.1,2.8l-1.3,1.8L10,35l-0.8,6.9l6.4-2.7l-2-1.6l1.1-1.6
39
+ c1.4-1.6,1.4-4-0.1-5.4L3.3,19.3l-1.4,1.4L13.2,32L13.2,32z">
40
+ </path>
41
+ <polygon
42
+ id="西北直行"
43
+ :stroke-width="PathWidth"
44
+ :fill="status[28].color"
45
+ :class="status[28].isshow ? '' : 'invisible'"
46
+ points="1.9,20.7 18.3,37.1 16.5,38.9 23.3,40.7 21.4,34 19.7,35.7 3.3,19.3"/>
47
+ <path
48
+ id="西北调头"
49
+ :stroke-width="PathWidth"
50
+ :fill="status[31].color"
51
+ :class="status[31].isshow ? '' : 'invisible'"
52
+ d="M15.7,21.6l-2.1-2.1l1.7-1.7l-6.7-1.8l1.8,6.7l1.8-1.8l2.1,2.1c0.7,0.7,0.6,2.1-0.4,3.1
53
+ c-0.9,0.9-2.4,1.1-3.1,0.4l-7.4-7.4l-1.4,1.4l7.4,7.4c1.5,1.5,4.2,1.3,5.9-0.4C17,25.7,17.2,23.1,15.7,21.6z"></path>
54
+ <path
55
+ id="西南左转"
56
+ :stroke-width="PathWidth"
57
+ :fill="status[21].color"
58
+ :class="status[21].isshow ? '' : 'invisible'"
59
+ d="M29.9,42.8L18.7,54l1.4,1.4l11.3-11.3c1.5-1.5,1.5-3.9,0.1-5.4l-1.1-1.6l2-1.6l-6.4-2.6
60
+ l0.8,6.9l2-1.6L30,40C30.6,40.8,30.7,42,29.9,42.8L29.9,42.8z"></path>
61
+ <path
62
+ id="西南右转"
63
+ :stroke-width="PathWidth"
64
+ :fill="status[22].color"
65
+ :class="status[22].isshow ? '' : 'invisible'"
66
+ d="M34.3,44.2l1.6,1.2l-1.6,2l6.9,0.8l-2.7-6.4l-1.6,2l-1.6-1.1c-1.5-1.5-3.9-1.5-5.4,0.1
67
+ L18.7,54l1.4,1.4l11.4-11.4c0.7-0.7,2-0.7,2.7,0L34.3,44.2z"></path>
68
+ <polygon
69
+ id="西南直行"
70
+ :stroke-width="PathWidth"
71
+ :fill="status[20].color"
72
+ :class="status[20].isshow ? '' : 'invisible'"
73
+ points="20.1,55.4 36.5,39 38.2,40.7 40.1,34 33.3,35.8 35.1,37.6 18.7,54"/>
74
+ <path
75
+ id="西南调头"
76
+ :stroke-width="PathWidth"
77
+ :fill="status[23].color"
78
+ :class="status[23].isshow ? '' : 'invisible'"
79
+ d="M21.1,41.7L19,43.8L17.3,42l-1.8,6.7l6.7-1.8l-1.8-1.8l2.1-2.1c0.7-0.7,2.1-0.6,3.1,0.4
80
+ c0.9,0.9,1.1,2.4,0.4,3.1L18.7,54l1.4,1.4l7.4-7.4c1.5-1.5,1.3-4.2-0.4-5.9C25.2,40.4,22.6,40.2,21.1,41.7z"></path>
81
+ <path
82
+ id="东南左转"
83
+ :stroke-width="PathWidth"
84
+ :fill="status[17].color"
85
+ :class="status[17].isshow ? '' : 'invisible'"
86
+ d="M41.4,25.5l11.2,11.2l1.4-1.4L42.8,24c-1.5-1.5-3.9-1.5-5.4-0.1L35.8,25l-1.5-1.9l-2.7,6.4
87
+ l6.9-0.8l-1.6-2l1.8-1.3C39.5,24.7,40.7,24.7,41.4,25.5L41.4,25.5z"></path>
88
+ <path
89
+ id="东南右转"
90
+ :stroke-width="PathWidth"
91
+ :fill="status[18].color"
92
+ :class="status[18].isshow ? '' : 'invisible'"
93
+ d="M42.8,24c-0.8-0.8-0.8-1.9-0.1-2.8l1.3-1.8l2,1.6l0.8-6.9l-6.4,2.7l1.9,1.5l-1.1,1.6
94
+ c-1.4,1.6-1.4,4,0.1,5.4l11.3,11.3l1.4-1.4L42.8,24L42.8,24z"></path>
95
+ <polygon
96
+ id="东南直行"
97
+ :stroke-width="PathWidth"
98
+ :fill="status[16].color"
99
+ :class="status[16].isshow ? '' : 'invisible'"
100
+ points="54.1,35.3 37.7,18.9 39.5,17.1 32.7,15.3 34.6,22 36.3,20.3 52.7,36.7"/>
101
+ <path
102
+ id="东南调头"
103
+ :stroke-width="PathWidth"
104
+ :fill="status[19].color"
105
+ :class="status[19].isshow ? '' : 'invisible'"
106
+ d="M40.3,34.4l2.1,2.1l-1.7,1.7l6.7,1.8l-1.8-6.7l-1.8,1.8l-2.1-2.1c-0.7-0.7-0.6-2.1,0.4-3.1
107
+ c0.9-0.9,2.4-1.1,3.1-0.4l7.4,7.4l1.4-1.4l-7.4-7.4c-1.5-1.5-4.2-1.3-5.9,0.4C39,30.1,38.8,32.9,40.3,34.4z"></path>
108
+ <path
109
+ id="东北左转"
110
+ :stroke-width="PathWidth"
111
+ :fill="status[25].color"
112
+ :class="status[25].isshow ? '' : 'invisible'"
113
+ d="M26.1,13.2L37.3,2l-1.4-1.4L24.6,11.9c-1.5,1.5-1.5,3.9-0.1,5.4l1.1,1.6l-2,1.6l6.4,2.6
114
+ l-0.8-6.9l-2,1.6L26,16C25.4,15.2,25.3,14,26.1,13.2L26.1,13.2z"></path>
115
+ <path
116
+ id="东北右转"
117
+ :stroke-width="PathWidth"
118
+ :fill="status[26].color"
119
+ :class="status[26].isshow ? '' : 'invisible'"
120
+ d="M21.8,11.8l-1.6-1.2l1.6-2l-6.9-0.8l2.7,6.4l1.6-2l1.6,1.1c1.5,1.5,3.9,1.5,5.4-0.1L37.3,2
121
+ l-1.4-1.4L24.6,11.9C23.9,12.6,22.6,12.6,21.8,11.8L21.8,11.8z"></path>
122
+ <polygon
123
+ id="东北直行"
124
+ :stroke-width="PathWidth"
125
+ :fill="status[24].color"
126
+ :class="status[24].isshow ? '' : 'invisible'"
127
+ points="35.9,0.6 19.5,17 17.8,15.3 15.9,22 22.7,20.2 20.9,18.4 37.3,2"/>
128
+ <path
129
+ id="东北调头"
130
+ :stroke-width="PathWidth"
131
+ :fill="status[27].color"
132
+ :class="status[27].isshow ? '' : 'invisible'"
133
+ d="M34.9,14.3l2.1-2.1l1.8,1.8l1.8-6.7L33.8,9l1.8,1.8l-2.1,2.1c-0.7,0.7-2.1,0.6-3.1-0.4
134
+ c-1-1-1.1-2.4-0.4-3.1L37.3,2l-1.4-1.4l-7.4,7.4c-1.5,1.5-1.3,4.2,0.4,5.9C30.8,15.6,33.4,15.8,34.9,14.3z"></path>
135
+ </g>
136
+ <g id="组">
137
+ <path
138
+ id="西左转_3_"
139
+ :stroke-width="PathWidth"
140
+ :fill="status[5].color"
141
+ :class="status[5].isshow ? '' : 'invisible'"
142
+ d="M20.3,39.3H4.4v2h16c2.1,0,3.8-1.7,3.9-3.8l0.3-1.9l2.5,0.3l-2.6-6.4l-4.3,5.4l2.5,0.3
143
+ l-0.3,2.2C22.2,38.5,21.4,39.3,20.3,39.3L20.3,39.3z"></path>
144
+ <path
145
+ id="西右转"
146
+ :stroke-width="PathWidth"
147
+ :fill="status[6].color"
148
+ :class="status[6].isshow ? '' : 'invisible'"
149
+ d="M20.3,41.3c1.1,0,1.9,0.8,2.1,1.9l0.3,2.2l-2.5,0.3l4.3,5.4l2.6-6.4L24.6,45l-0.3-1.9
150
+ c-0.1-2.1-1.8-3.8-3.9-3.8h-16v2H20.3L20.3,41.3z"></path>
151
+ <polygon
152
+ id="西直行_1_"
153
+ :stroke-width="PathWidth"
154
+ :fill="status[4].color"
155
+ :class="status[4].isshow ? '' : 'invisible'"
156
+ points="4.4,41.3 27.6,41.3 27.6,43.8 33.7,40.3 27.6,36.9 27.6,39.3 4.4,39.3"/>
157
+ <path
158
+ id="西调头_1_"
159
+ :stroke-width="PathWidth"
160
+ :fill="status[7].color"
161
+ :class="status[7].isshow ? '' : 'invisible'"
162
+ d="M14.8,32.2h-2.9v-2.4l-6,3.5l6,3.5v-2.5h2.9c1,0,1.9,1.1,1.9,2.5c0,1.3-0.9,2.5-1.9,2.5H4.4
163
+ v2h10.4c2.1,0,3.9-2,3.9-4.5C18.6,34.2,16.9,32.2,14.8,32.2z"></path>
164
+ <path
165
+ id="南左转_1_"
166
+ :stroke-width="PathWidth"
167
+ :fill="status[13].color"
168
+ :class="status[13].isshow ? '' : 'invisible'"
169
+ d="M39.8,37.1V53h2V37c0-2.1-1.7-3.8-3.8-3.9l-1.9-0.3l0.3-2.5L30,33l5.4,4.3l0.3-2.5l2.2,0.3
170
+ C38.9,35.2,39.8,36,39.8,37.1L39.8,37.1z"/>
171
+ <path
172
+ id="南右转_1_"
173
+ :stroke-width="PathWidth"
174
+ :fill="status[14].color"
175
+ :class="status[14].isshow ? '' : 'invisible'"
176
+ d="M43.9,35l2-0.3l0.3,2.5l5.4-4.3l-6.4-2.6l0.3,2.5l-1.9,0.3c-2.1,0-3.8,1.7-3.8,3.9v16h2
177
+ V36.9c0-1,0.9-1.9,1.9-1.9H43.9z"/>
178
+ <polygon
179
+ id="南直行_1_"
180
+ :stroke-width="PathWidth"
181
+ :fill="status[12].color"
182
+ :class="status[12].isshow ? '' : 'invisible'"
183
+ points="41.8,53 41.8,29.8 44.2,29.8 40.8,23.7 37.3,29.8 39.8,29.8 39.8,53"/>
184
+ <path
185
+ id="南调头_1_"
186
+ :stroke-width="PathWidth"
187
+ :fill="status[15].color"
188
+ :class="status[15].isshow ? '' : 'invisible'"
189
+ d="M32.8,42.6v2.9h-2.5l3.5,6l3.5-6h-2.5v-2.9c0-1,1.1-1.9,2.5-1.9c1.3,0,2.5,0.9,2.5,1.9V53h2
190
+ V42.6c0-2.1-2-3.9-4.5-3.9C34.8,38.8,32.8,40.5,32.8,42.6z"/>
191
+ <path
192
+ id="东左转_3_"
193
+ :stroke-width="PathWidth"
194
+ :fill="status[1].color"
195
+ :class="status[1].isshow ? '' : 'invisible'"
196
+ d="M35.7,16.7h15.9v-2h-16c-2.1,0-3.8,1.7-3.9,3.8l-0.3,1.9L29,20.1l2.6,6.4l4.3-5.4l-2.5-0.3
197
+ l0.3-2.2C33.8,17.5,34.6,16.7,35.7,16.7L35.7,16.7z"/>
198
+ <path
199
+ id="东右转"
200
+ :stroke-width="PathWidth"
201
+ :fill="status[2].color"
202
+ :class="status[2].isshow ? '' : 'invisible'"
203
+ d="M35.7,14.7c-1.1,0-1.9-0.8-2-1.9l-0.3-2.2l2.5-0.3l-4.3-5.4L29,11.3l2.4-0.3l0.3,1.9
204
+ c0.1,2.1,1.8,3.8,3.9,3.8h16v-2H35.7L35.7,14.7z"/>
205
+ <polygon
206
+ id="东直行_1_"
207
+ :stroke-width="PathWidth"
208
+ :fill="status[0].color"
209
+ :class="status[0].isshow ? '' : 'invisible'"
210
+ points="51.6,14.7 28.4,14.7 28.4,12.2 22.3,15.7 28.4,19.1 28.4,16.7 51.6,16.7"/>
211
+ <path
212
+ id="东调头_1_"
213
+ :stroke-width="PathWidth"
214
+ :fill="status[3].color"
215
+ :class="status[3].isshow ? '' : 'invisible'"
216
+ d="M41.2,23.8h2.9v2.4l6-3.5l-6-3.5v2.5h-2.9c-1,0-1.9-1.1-1.9-2.5c0-1.3,0.9-2.5,1.9-2.5h10.4
217
+ v-2H41.2c-2.1,0-3.9,2-3.9,4.5S39.1,23.8,41.2,23.8z"/>
218
+ <path
219
+ id="北左转_1_"
220
+ :stroke-width="PathWidth"
221
+ :fill="status[9].color"
222
+ :class="status[9].isshow ? '' : 'invisible'"
223
+ d="M16.2,18.9V3h-2v16c0,2.1,1.7,3.8,3.8,3.9l1.9,0.3l-0.3,2.5L26,23l-5.4-4.3l-0.3,2.5
224
+ l-2.2-0.3C17.1,20.8,16.2,20,16.2,18.9L16.2,18.9z"/>
225
+ <path
226
+ id="北右转_1_"
227
+ :stroke-width="PathWidth"
228
+ :fill="status[10].color"
229
+ :class="status[10].isshow ? '' : 'invisible'"
230
+ d="M12.2,20.9l-2,0.3l-0.3-2.5L4.4,23l6.4,2.6l-0.3-2.5l1.9-0.3c2.1,0,3.8-1.7,3.8-3.9V3h-2v16
231
+ c0,1-0.9,1.9-1.9,1.9H12.2z"/>
232
+ <polygon
233
+ id="北直行_1_"
234
+ :stroke-width="PathWidth"
235
+ :fill="status[8].color"
236
+ :class="status[8].isshow ? '' : 'invisible'"
237
+ points="14.2,3 14.2,26.2 11.8,26.2 15.2,32.3 18.7,26.2 16.2,26.2 16.2,3"/>
238
+ <path
239
+ id="北调头_1_"
240
+ :stroke-width="PathWidth"
241
+ :fill="status[11].color"
242
+ :class="status[11].isshow ? '' : 'invisible'"
243
+ d="M23.2,13.4v-2.9h2.5l-3.5-6l-3.5,6h2.5v2.9c0,1-1.1,1.9-2.5,1.9s-2.5-0.9-2.5-1.9V3h-2v10.4
244
+ c0,2.1,2,3.9,4.5,3.9C21.2,17.2,23.2,15.5,23.2,13.4z"/>
245
+ </g>
246
+ </svg>
247
+ </div>
248
+ <div :style="{position: 'absolute', left: Data?Data.left:0, top: Data?Data.top:0}">
249
+ <svg version="1.1"
250
+ id="图层_1"
251
+ xmlns="http://www.w3.org/2000/svg"
252
+ xmlns:xlink="http://www.w3.org/1999/xlink"
253
+ viewBox="0 0 50 50"
254
+ style="enable-background:new 0 0 50 50;"
255
+ :width="Width"
256
+ :height="Height"
257
+ xml:space="preserve">
258
+ <g>
259
+ <g id="东北行人" class="st0"
260
+ :class="peoplestatus[18].isshow? '' : 'invisible'"
261
+ >
262
+ <rect x="33.9" y="15.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -0.9839 30.7754)" class="st1" width="5.6" height="1.6"/>
263
+ <rect x="32.1" y="14" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -0.2517 29.0076)" class="st1" width="5.6" height="1.6"/>
264
+ <rect x="35.6" y="17.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -1.7161 32.5431)" class="st1" width="5.6" height="1.6"/>
265
+ <rect x="37.4" y="19.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -2.4484 34.3109)" class="st1" width="5.6" height="1.6"/>
266
+ <rect x="39.2" y="21.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -3.1806 36.0787)" class="st1" width="5.6" height="1.6"/>
267
+ <rect x="40.9" y="22.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -3.9128 37.8464)" class="st1" width="5.6" height="1.6"/>
268
+ <rect x="42.7" y="24.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.6451 39.6142)" class="st1" width="5.6" height="1.6"/>
269
+ <rect x="25.1" y="7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 2.648 22.0073)" class="st1" width="5.6" height="1.6"/>
270
+ <rect x="23.3" y="5.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 3.3802 20.2395)" class="st1" width="5.6" height="1.6"/>
271
+ <rect x="21.6" y="3.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 4.1124 18.4717)" class="st1" width="5.6" height="1.6"/>
272
+ <rect x="19.8" y="1.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 4.8447 16.704)" class="st1" width="5.6" height="1.6"/>
273
+ <rect x="26.9" y="8.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 1.9157 23.775)" class="st1" width="5.6" height="1.6"/>
274
+ <rect x="28.6" y="10.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 1.1835 25.5428)" class="st1" width="5.6" height="1.6"/>
275
+ <rect x="30.3" y="12.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 0.4806 27.2398)" class="st1" width="5.6" height="1.6"/>
276
+ </g>
277
+ <g id="西南行人" class="st0"
278
+ :class="peoplestatus[17].isshow? '' : 'invisible'"
279
+ >
280
+ <rect x="13.8" y="35.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -21.0657 22.4572)" class="st1" width="5.6" height="1.6"/>
281
+ <rect x="12" y="34.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -20.3335 20.6894)" class="st1" width="5.6" height="1.6"/>
282
+ <rect x="15.5" y="37.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -21.798 24.225)" class="st1" width="5.6" height="1.6"/>
283
+ <rect x="17.3" y="39.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -22.5302 25.9927)" class="st1" width="5.6" height="1.6"/>
284
+ <rect x="19.1" y="41.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -23.2624 27.7605)" class="st1" width="5.6" height="1.6"/>
285
+ <rect x="20.8" y="42.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -23.9947 29.5283)" class="st1" width="5.6" height="1.6"/>
286
+ <rect x="22.6" y="44.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -24.7269 31.296)" class="st1" width="5.6" height="1.6"/>
287
+ <rect x="5" y="27.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -17.4339 13.6891)" class="st1" width="5.6" height="1.6"/>
288
+ <rect x="3.2" y="25.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -16.7016 11.9213)" class="st1" width="5.6" height="1.6"/>
289
+ <rect x="1.5" y="23.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -15.9694 10.1536)" class="st1" width="5.6" height="1.6"/>
290
+ <rect x="-0.3" y="21.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -15.2372 8.3858)" class="st1" width="5.6" height="1.6"/>
291
+ <rect x="6.8" y="28.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -18.1661 15.4569)" class="st1" width="5.6" height="1.6"/>
292
+ <rect x="8.5" y="30.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -18.8983 17.2246)" class="st1" width="5.6" height="1.6"/>
293
+ <rect x="10.2" y="32.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -19.6013 18.9217)" class="st1" width="5.6" height="1.6"/>
294
+ </g>
295
+ <g id="东南行人" class="st0"
296
+ :class="peoplestatus[16].isshow? '' : 'invisible'"
297
+ >
298
+ <rect x="30.6" y="33.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -16.7165 32.9572)" class="st1" width="1.6" height="5.6"/>
299
+ <rect x="32.4" y="32.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -14.9487 33.6894)" class="st1" width="1.6" height="5.6"/>
300
+ <rect x="28.9" y="35.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -18.4843 32.225)" class="st1" width="1.6" height="5.6"/>
301
+ <rect x="27.1" y="37.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -20.252 31.4927)" class="st1" width="1.6" height="5.6"/>
302
+ <rect x="25.3" y="39.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -22.0198 30.7605)" class="st1" width="1.6" height="5.6"/>
303
+ <rect x="23.6" y="40.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -23.7876 30.0283)" class="st1" width="1.6" height="5.6"/>
304
+ <rect x="21.8" y="42.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -25.5553 29.296)" class="st1" width="1.6" height="5.6"/>
305
+ <rect x="39.4" y="25.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.9484 36.5891)" class="st1" width="1.6" height="5.6"/>
306
+ <rect x="41.2" y="23.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -6.1806 37.3213)" class="st1" width="1.6" height="5.6"/>
307
+ <rect x="42.9" y="21.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.4128 38.0536)" class="st1" width="1.6" height="5.6"/>
308
+ <rect x="44.7" y="19.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -2.6451 38.7858)" class="st1" width="1.6" height="5.6"/>
309
+ <rect x="37.6" y="26.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -9.7161 35.8569)" class="st1" width="1.6" height="5.6"/>
310
+ <rect x="35.9" y="28.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -11.4839 35.1246)" class="st1" width="1.6" height="5.6"/>
311
+ <rect x="34.2" y="30.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -13.181 34.4217)" class="st1" width="1.6" height="5.6"/>
312
+ </g>
313
+ <g id="西北行人" class="st0"
314
+ :class="peoplestatus[19].isshow? '' : 'invisible'"
519
315
  >
520
- <rect x="19.9" y="28.4" class="st1" width="1.6" height="5.6"/>
521
- <rect x="22.4" y="28.4" class="st1" width="1.6" height="5.6"/>
522
- <rect x="24.9" y="28.4" class="st1" width="1.6" height="5.6"/>
523
- <rect x="27.4" y="28.4" class="st1" width="1.6" height="5.6"/>
524
- <rect x="29.9" y="28.4" class="st1" width="1.6" height="5.6"/>
525
- <rect x="32.4" y="28.4" class="st1" width="1.6" height="5.6"/>
526
- </g>
527
- <g id="南左"
528
- :class="peoplestatus[13].isshow? '' : 'invisible'"
529
- >
530
- <rect x="7.5" y="28.4" class="st1" width="1.6" height="5.6"/>
531
- <rect x="5" y="28.4" class="st1" width="1.6" height="5.6"/>
532
- <rect x="2.5" y="28.4" class="st1" width="1.6" height="5.6"/>
533
- <rect x="0" y="28.4" class="st1" width="1.6" height="5.6"/>
534
- <rect x="10" y="28.4" class="st1" width="1.6" height="5.6"/>
535
- <rect x="12.5" y="28.4" class="st1" width="1.6" height="5.6"/>
536
- </g>
537
- </g>
538
- <g id="二次过街-北_1_" class="st0">
539
- <g id="北右_1_"
540
- :class="peoplestatus[14].isshow? '' : 'invisible'"
541
- >
542
- <rect x="19.9" class="st1" width="1.6" height="5.6"/>
543
- <rect x="22.4" class="st1" width="1.6" height="5.6"/>
544
- <rect x="24.9" class="st1" width="1.6" height="5.6"/>
545
- <rect x="27.4" class="st1" width="1.6" height="5.6"/>
546
- <rect x="29.9" class="st1" width="1.6" height="5.6"/>
547
- <rect x="32.4" class="st1" width="1.6" height="5.6"/>
548
- </g>
549
- <g id="北左_1_"
550
- :class="peoplestatus[15].isshow? '' : 'invisible'"
551
- >
552
- <rect x="7.5" class="st1" width="1.6" height="5.6"/>
553
- <rect x="5" class="st1" width="1.6" height="5.6"/>
554
- <rect x="2.5" class="st1" width="1.6" height="5.6"/>
555
- <rect x="0" class="st1" width="1.6" height="5.6"/>
556
- <rect x="10" class="st1" width="1.6" height="5.6"/>
557
- <rect x="12.5" class="st1" width="1.6" height="5.6"/>
558
- </g>
559
- </g>
560
- </svg>
561
- </div>
562
- <!-- </div> -->
316
+ <rect x="10.5" y="13.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -8.3983 12.8754)" class="st1" width="1.6" height="5.6"/>
317
+ <rect x="12.3" y="12" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -6.6306 13.6076)" class="st1" width="1.6" height="5.6"/>
318
+ <rect x="8.8" y="15.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -10.1661 12.1431)" class="st1" width="1.6" height="5.6"/>
319
+ <rect x="7" y="17.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -11.9339 11.4109)" class="st1" width="1.6" height="5.6"/>
320
+ <rect x="5.2" y="19.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -13.7016 10.6787)" class="st1" width="1.6" height="5.6"/>
321
+ <rect x="3.5" y="20.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -15.4694 9.9464)" class="st1" width="1.6" height="5.6"/>
322
+ <rect x="1.7" y="22.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -17.2372 9.2142)" class="st1" width="1.6" height="5.6"/>
323
+ <rect x="19.3" y="5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 0.3698 16.5073)" class="st1" width="1.6" height="5.6"/>
324
+ <rect x="21.1" y="3.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 2.1376 17.2395)" class="st1" width="1.6" height="5.6"/>
325
+ <rect x="22.8" y="1.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 3.9053 17.9717)" class="st1" width="1.6" height="5.6"/>
326
+ <rect x="24.6" y="-0.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 5.6731 18.704)" class="st1" width="1.6" height="5.6"/>
327
+ <rect x="17.5" y="6.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -1.398 15.775)" class="st1" width="1.6" height="5.6"/>
328
+ <rect x="15.8" y="8.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -3.1657 15.0428)" class="st1" width="1.6" height="5.6"/>
329
+ <rect x="14.1" y="10.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.8628 14.3398)" class="st1" width="1.6" height="5.6"/>
330
+ </g>
331
+ <g id="二次过街-西北" class="st0">
332
+ <g id="西北下"
333
+ :class="peoplestatus[27].isshow? '' : 'invisible'"
334
+ >
335
+ <rect x="10.5" y="13.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -8.3983 12.8754)" class="st1" width="1.6" height="5.6"/>
336
+ <rect x="8.8" y="15.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -10.1661 12.1431)" class="st1" width="1.6" height="5.6"/>
337
+ <rect x="7" y="17.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -11.9339 11.4109)" class="st1" width="1.6" height="5.6"/>
338
+ <rect x="5.2" y="19.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -13.7016 10.6787)" class="st1" width="1.6" height="5.6"/>
339
+ <rect x="3.5" y="20.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -15.4694 9.9464)" class="st1" width="1.6" height="5.6"/>
340
+ <rect x="1.7" y="22.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -17.2372 9.2142)" class="st1" width="1.6" height="5.6"/>
341
+ </g>
342
+ <g id="西北上"
343
+ :class="peoplestatus[26].isshow? '' : 'invisible'"
344
+ >
345
+ <rect x="19.3" y="5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 0.3698 16.5073)" class="st1" width="1.6" height="5.6"/>
346
+ <rect x="21.1" y="3.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 2.1376 17.2395)" class="st1" width="1.6" height="5.6"/>
347
+ <rect x="22.8" y="1.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 3.9053 17.9717)" class="st1" width="1.6" height="5.6"/>
348
+ <rect x="24.6" y="-0.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 5.6731 18.704)" class="st1" width="1.6" height="5.6"/>
349
+ <rect x="17.5" y="6.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -1.398 15.775)" class="st1" width="1.6" height="5.6"/>
350
+ <rect x="15.8" y="8.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -3.1657 15.0428)" class="st1" width="1.6" height="5.6"/>
351
+ </g>
352
+ </g>
353
+ <g id="二次过街-东南" class="st0">
354
+ <g id="东南下"
355
+ :class="peoplestatus[21].isshow? '' : 'invisible'"
356
+ >
357
+ <rect x="35.9" y="28.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -11.4839 35.1246)" class="st1" width="1.6" height="5.6"/>
358
+ <rect x="37.6" y="26.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -9.7161 35.8569)" class="st1" width="1.6" height="5.6"/>
359
+ <rect x="39.4" y="25.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.9484 36.5891)" class="st1" width="1.6" height="5.6"/>
360
+ <rect x="41.2" y="23.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -6.1806 37.3213)" class="st1" width="1.6" height="5.6"/>
361
+ <rect x="42.9" y="21.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.4128 38.0536)" class="st1" width="1.6" height="5.6"/>
362
+ <rect x="44.7" y="19.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -2.6451 38.7858)" class="st1" width="1.6" height="5.6"/>
363
+ </g>
364
+ <g id="东南上"
365
+ :class="peoplestatus[20].isshow? '' : 'invisible'"
366
+ >
367
+ <rect x="27.1" y="37.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -20.252 31.4927)" class="st1" width="1.6" height="5.6"/>
368
+ <rect x="25.3" y="39.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -22.0198 30.7605)" class="st1" width="1.6" height="5.6"/>
369
+ <rect x="23.6" y="40.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -23.7876 30.0283)" class="st1" width="1.6" height="5.6"/>
370
+ <rect x="21.8" y="42.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -25.5553 29.296)" class="st1" width="1.6" height="5.6"/>
371
+ <rect x="28.9" y="35.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -18.4843 32.225)" class="st1" width="1.6" height="5.6"/>
372
+ <rect x="30.6" y="33.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -16.7165 32.9572)" class="st1" width="1.6" height="5.6"/>
373
+ </g>
374
+ </g>
375
+ <g id="二次过街-西南" class="st0">
376
+ <g id="西南下"
377
+ :class="peoplestatus[23].isshow? '' : 'invisible'"
378
+ >
379
+ <rect x="13.8" y="35.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -21.0657 22.4572)" class="st1" width="5.6" height="1.6"/>
380
+ <rect x="15.5" y="37.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -21.798 24.225)" class="st1" width="5.6" height="1.6"/>
381
+ <rect x="17.3" y="39.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -22.5302 25.9927)" class="st1" width="5.6" height="1.6"/>
382
+ <rect x="19.1" y="41.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -23.2624 27.7605)" class="st1" width="5.6" height="1.6"/>
383
+ <rect x="20.8" y="42.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -23.9947 29.5283)" class="st1" width="5.6" height="1.6"/>
384
+ <rect x="22.6" y="44.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -24.7269 31.296)" class="st1" width="5.6" height="1.6"/>
385
+ </g>
386
+ <g id="西南上"
387
+ :class="peoplestatus[22].isshow? '' : 'invisible'"
388
+ >
389
+ <rect x="5" y="27.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -17.4339 13.6891)" class="st1" width="5.6" height="1.6"/>
390
+ <rect x="3.2" y="25.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -16.7016 11.9213)" class="st1" width="5.6" height="1.6"/>
391
+ <rect x="1.5" y="23.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -15.9694 10.1536)" class="st1" width="5.6" height="1.6"/>
392
+ <rect x="-0.3" y="21.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -15.2372 8.3858)" class="st1" width="5.6" height="1.6"/>
393
+ <rect x="6.8" y="28.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -18.1661 15.4569)" class="st1" width="5.6" height="1.6"/>
394
+ <rect x="8.5" y="30.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -18.8983 17.2246)" class="st1" width="5.6" height="1.6"/>
395
+ </g>
396
+ </g>
397
+ <g id="二次过街-东北" class="st0">
398
+ <g id="东北下"
399
+ :class="peoplestatus[25].isshow? '' : 'invisible'"
400
+ >
401
+ <rect x="33.9" y="15.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -0.9839 30.7754)" class="st1" width="5.6" height="1.6"/>
402
+ <rect x="35.6" y="17.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -1.7161 32.5431)" class="st1" width="5.6" height="1.6"/>
403
+ <rect x="37.4" y="19.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -2.4484 34.3109)" class="st1" width="5.6" height="1.6"/>
404
+ <rect x="39.2" y="21.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -3.1806 36.0787)" class="st1" width="5.6" height="1.6"/>
405
+ <rect x="40.9" y="22.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -3.9128 37.8464)" class="st1" width="5.6" height="1.6"/>
406
+ <rect x="42.7" y="24.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.6451 39.6142)" class="st1" width="5.6" height="1.6"/>
407
+ </g>
408
+ <g id="东北上"
409
+ :class="peoplestatus[24].isshow? '' : 'invisible'"
410
+ >
411
+ <rect x="25.1" y="7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 2.648 22.0073)" class="st1" width="5.6" height="1.6"/>
412
+ <rect x="23.3" y="5.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 3.3802 20.2395)" class="st1" width="5.6" height="1.6"/>
413
+ <rect x="21.6" y="3.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 4.1124 18.4717)" class="st1" width="5.6" height="1.6"/>
414
+ <rect x="19.8" y="1.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 4.8447 16.704)" class="st1" width="5.6" height="1.6"/>
415
+ <rect x="26.9" y="8.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 1.9157 23.775)" class="st1" width="5.6" height="1.6"/>
416
+ <rect x="28.6" y="10.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 1.1835 25.5428)" class="st1" width="5.6" height="1.6"/>
417
+ </g>
418
+ </g>
419
+ </g>
420
+ <g>
421
+ <g id="路段行人过街-东西"
422
+ :class="peoplestatus[0].isshow? '' : 'invisible'"
423
+ class="st0">
424
+ <rect x="26.9" y="21.2" class="st1" width="1.6" height="5.6"/>
425
+ <rect x="24.4" y="21.2" class="st1" width="1.6" height="5.6"/>
426
+ <rect x="29.4" y="21.2" class="st1" width="1.6" height="5.6"/>
427
+ <rect x="31.9" y="21.2" class="st1" width="1.6" height="5.6"/>
428
+ <rect x="34.4" y="21.2" class="st1" width="1.6" height="5.6"/>
429
+ <rect x="36.9" y="21.2" class="st1" width="1.6" height="5.6"/>
430
+ <rect x="39.4" y="21.2" class="st1" width="1.6" height="5.6"/>
431
+ <rect x="14.5" y="21.2" class="st1" width="1.6" height="5.6"/>
432
+ <rect x="12" y="21.2" class="st1" width="1.6" height="5.6"/>
433
+ <rect x="9.5" y="21.2" class="st1" width="1.6" height="5.6"/>
434
+ <rect x="7" y="21.2" class="st1" width="1.6" height="5.6"/>
435
+ <rect x="17" y="21.2" class="st1" width="1.6" height="5.6"/>
436
+ <rect x="19.5" y="21.2" class="st1" width="1.6" height="5.6"/>
437
+ <rect x="21.9" y="21.2" class="st1" width="1.6" height="5.6"/>
438
+ </g>
439
+ <g id="路段行人过街-南北" class="st0"
440
+ :class="peoplestatus[1].isshow? '' : 'invisible'"
441
+ >
442
+ <rect x="21.2" y="26.9" class="st1" width="5.6" height="1.6"/>
443
+ <rect x="21.2" y="24.4" class="st1" width="5.6" height="1.6"/>
444
+ <rect x="21.2" y="29.4" class="st1" width="5.6" height="1.6"/>
445
+ <rect x="21.2" y="31.9" class="st1" width="5.6" height="1.6"/>
446
+ <rect x="21.2" y="34.4" class="st1" width="5.6" height="1.6"/>
447
+ <rect x="21.2" y="36.9" class="st1" width="5.6" height="1.6"/>
448
+ <rect x="21.2" y="39.4" class="st1" width="5.6" height="1.6"/>
449
+ <rect x="21.2" y="14.5" class="st1" width="5.6" height="1.6"/>
450
+ <rect x="21.2" y="12" class="st1" width="5.6" height="1.6"/>
451
+ <rect x="21.2" y="9.5" class="st1" width="5.6" height="1.6"/>
452
+ <rect x="21.2" y="7" class="st1" width="5.6" height="1.6"/>
453
+ <rect x="21.2" y="17" class="st1" width="5.6" height="1.6"/>
454
+ <rect x="21.2" y="19.5" class="st1" width="5.6" height="1.6"/>
455
+ <rect x="21.2" y="21.9" class="st1" width="5.6" height="1.6"/>
456
+ </g>
457
+ <g id="斜向行人1" class="st0"
458
+ :class="peoplestatus[2].isshow? '' : 'invisible'"
459
+ >
460
+ <rect x="21.2" y="23.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -9.9456 23.9999)" class="st1" width="5.6" height="1.6"/>
461
+ <rect x="19.4" y="21.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -9.2334 22.1999)" class="st1" width="5.6" height="1.6"/>
462
+ <rect x="22.9" y="25" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -10.6993 25.6999)" class="st1" width="5.6" height="1.6"/>
463
+ <rect x="24.7" y="26.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -11.4115 27.4998)" class="st1" width="5.6" height="1.6"/>
464
+ <rect x="26.5" y="28.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -12.1237 29.2997)" class="st1" width="5.6" height="1.6"/>
465
+ <rect x="28.2" y="30.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -12.8774 30.9998)" class="st1" width="5.6" height="1.6"/>
466
+ <rect x="30" y="32" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -13.5896 32.7997)" class="st1" width="5.6" height="1.6"/>
467
+ <rect x="31.7" y="33.8" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -14.3344 34.4998)" class="st1" width="5.6" height="1.6"/>
468
+ <rect x="33.5" y="35.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -15.0467 36.2997)" class="st1" width="5.6" height="1.6"/>
469
+ <rect x="35.3" y="37.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -15.7589 38.0997)" class="st1" width="5.6" height="1.6"/>
470
+ <rect x="12.4" y="14.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -6.3016 15.1999)" class="st1" width="5.6" height="1.6"/>
471
+ <rect x="10.6" y="12.6" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -5.5893 13.3999)" class="st1" width="5.6" height="1.6"/>
472
+ <rect x="8.9" y="10.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.8357 11.7)" class="st1" width="5.6" height="1.6"/>
473
+ <rect x="7.1" y="9.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.1235 9.9)" class="st1" width="5.6" height="1.6"/>
474
+ <rect x="14.1" y="16.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.0845 16.9706)" class="st1" width="5.6" height="1.6"/>
475
+ <rect x="15.9" y="17.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -7.7675 18.6999)" class="st1" width="5.6" height="1.6"/>
476
+ <rect x="17.7" y="19.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -8.4797 20.4999)" class="st1" width="5.6" height="1.6"/>
477
+ </g>
478
+ <g id="斜向行人2" class="st0"
479
+ :class="peoplestatus[3].isshow? '' : 'invisible'"
480
+ >
481
+ <rect x="23.2" y="21.2" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -9.9412 23.9954)" class="st1" width="1.6" height="5.6"/>
482
+ <rect x="24.9" y="19.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -8.2119 24.6784)" class="st1" width="1.6" height="5.6"/>
483
+ <rect x="21.4" y="22.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -11.7119 23.2125)" class="st1" width="1.6" height="5.6"/>
484
+ <rect x="19.7" y="24.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -13.4412 22.5296)" class="st1" width="1.6" height="5.6"/>
485
+ <rect x="17.9" y="26.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -15.2412 21.8173)" class="st1" width="1.6" height="5.6"/>
486
+ <rect x="16.1" y="28.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -17.0119 21.0344)" class="st1" width="1.6" height="5.6"/>
487
+ <rect x="14.4" y="30" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -18.7411 20.3514)" class="st1" width="1.6" height="5.6"/>
488
+ <rect x="12.6" y="31.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -20.5118 19.5773)" class="st1" width="1.6" height="5.6"/>
489
+ <rect x="10.9" y="33.5" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -22.2411 18.8944)" class="st1" width="1.6" height="5.6"/>
490
+ <rect x="9.1" y="35.3" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -24.0411 18.1821)" class="st1" width="1.6" height="5.6"/>
491
+ <rect x="32" y="12.4" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -1.1413 27.6394)" class="st1" width="1.6" height="5.6"/>
492
+ <rect x="33.7" y="10.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 0.588 28.3223)" class="st1" width="1.6" height="5.6"/>
493
+ <rect x="35.5" y="8.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 2.3587 29.1053)" class="st1" width="1.6" height="5.6"/>
494
+ <rect x="37.3" y="7.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 4.1587 29.8175)" class="st1" width="1.6" height="5.6"/>
495
+ <rect x="30.2" y="14.1" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -2.912 26.8565)" class="st1" width="1.6" height="5.6"/>
496
+ <rect x="28.5" y="15.9" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -4.6412 26.1735)" class="st1" width="1.6" height="5.6"/>
497
+ <rect x="26.7" y="17.7" transform="matrix(0.7071 -0.7071 0.7071 0.7071 -6.4412 25.4613)" class="st1" width="1.6" height="5.6"/>
498
+ </g>
499
+ <g id="北行人" class="st0"
500
+ :class="peoplestatus[4].isshow? '' : 'invisible'"
501
+ >
502
+ <rect x="26.9" y="7" class="st1" width="1.6" height="5.6"/>
503
+ <rect x="24.4" y="7" class="st1" width="1.6" height="5.6"/>
504
+ <rect x="29.4" y="7" class="st1" width="1.6" height="5.6"/>
505
+ <rect x="31.9" y="7" class="st1" width="1.6" height="5.6"/>
506
+ <rect x="34.4" y="7" class="st1" width="1.6" height="5.6"/>
507
+ <rect x="36.9" y="7" class="st1" width="1.6" height="5.6"/>
508
+ <rect x="39.4" y="7" class="st1" width="1.6" height="5.6"/>
509
+ <rect x="14.5" y="7" class="st1" width="1.6" height="5.6"/>
510
+ <rect x="12" y="7" class="st1" width="1.6" height="5.6"/>
511
+ <rect x="9.5" y="7" class="st1" width="1.6" height="5.6"/>
512
+ <rect x="7" y="7" class="st1" width="1.6" height="5.6"/>
513
+ <rect x="17" y="7" class="st1" width="1.6" height="5.6"/>
514
+ <rect x="19.5" y="7" class="st1" width="1.6" height="5.6"/>
515
+ <rect x="21.9" y="7" class="st1" width="1.6" height="5.6"/>
516
+ </g>
517
+ <g id="南行人" class="st0"
518
+ :class="peoplestatus[5].isshow? '' : 'invisible'"
519
+ >
520
+ <rect x="26.9" y="35.4" class="st1" width="1.6" height="5.6"/>
521
+ <rect x="24.4" y="35.4" class="st1" width="1.6" height="5.6"/>
522
+ <rect x="29.4" y="35.4" class="st1" width="1.6" height="5.6"/>
523
+ <rect x="31.9" y="35.4" class="st1" width="1.6" height="5.6"/>
524
+ <rect x="34.4" y="35.4" class="st1" width="1.6" height="5.6"/>
525
+ <rect x="36.9" y="35.4" class="st1" width="1.6" height="5.6"/>
526
+ <rect x="39.4" y="35.4" class="st1" width="1.6" height="5.6"/>
527
+ <rect x="14.5" y="35.4" class="st1" width="1.6" height="5.6"/>
528
+ <rect x="12" y="35.4" class="st1" width="1.6" height="5.6"/>
529
+ <rect x="9.5" y="35.4" class="st1" width="1.6" height="5.6"/>
530
+ <rect x="7" y="35.4" class="st1" width="1.6" height="5.6"/>
531
+ <rect x="17" y="35.4" class="st1" width="1.6" height="5.6"/>
532
+ <rect x="19.5" y="35.4" class="st1" width="1.6" height="5.6"/>
533
+ <rect x="21.9" y="35.4" class="st1" width="1.6" height="5.6"/>
534
+ </g>
535
+ <g id="东行人" class="st0"
536
+ :class="peoplestatus[6].isshow? '' : 'invisible'"
537
+ >
538
+ <rect x="35.4" y="26.9" class="st1" width="5.6" height="1.6"/>
539
+ <rect x="35.4" y="24.4" class="st1" width="5.6" height="1.6"/>
540
+ <rect x="35.4" y="29.4" class="st1" width="5.6" height="1.6"/>
541
+ <rect x="35.4" y="31.9" class="st1" width="5.6" height="1.6"/>
542
+ <rect x="35.4" y="34.4" class="st1" width="5.6" height="1.6"/>
543
+ <rect x="35.4" y="36.9" class="st1" width="5.6" height="1.6"/>
544
+ <rect x="35.4" y="39.4" class="st1" width="5.6" height="1.6"/>
545
+ <rect x="35.4" y="14.5" class="st1" width="5.6" height="1.6"/>
546
+ <rect x="35.4" y="12" class="st1" width="5.6" height="1.6"/>
547
+ <rect x="35.4" y="9.5" class="st1" width="5.6" height="1.6"/>
548
+ <rect x="35.4" y="7" class="st1" width="5.6" height="1.6"/>
549
+ <rect x="35.4" y="17" class="st1" width="5.6" height="1.6"/>
550
+ <rect x="35.4" y="19.5" class="st1" width="5.6" height="1.6"/>
551
+ <rect x="35.4" y="21.9" class="st1" width="5.6" height="1.6"/>
552
+ </g>
553
+ <g id="西行人" class="st0"
554
+ :class="peoplestatus[7].isshow? '' : 'invisible'"
555
+ >
556
+ <rect x="7" y="26.9" class="st1" width="5.6" height="1.6"/>
557
+ <rect x="7" y="24.4" class="st1" width="5.6" height="1.6"/>
558
+ <rect x="7" y="29.4" class="st1" width="5.6" height="1.6"/>
559
+ <rect x="7" y="31.9" class="st1" width="5.6" height="1.6"/>
560
+ <rect x="7" y="34.4" class="st1" width="5.6" height="1.6"/>
561
+ <rect x="7" y="36.9" class="st1" width="5.6" height="1.6"/>
562
+ <rect x="7" y="39.4" class="st1" width="5.6" height="1.6"/>
563
+ <rect x="7" y="14.5" class="st1" width="5.6" height="1.6"/>
564
+ <rect x="7" y="12" class="st1" width="5.6" height="1.6"/>
565
+ <rect x="7" y="9.5" class="st1" width="5.6" height="1.6"/>
566
+ <rect x="7" y="7" class="st1" width="5.6" height="1.6"/>
567
+ <rect x="7" y="17" class="st1" width="5.6" height="1.6"/>
568
+ <rect x="7" y="19.5" class="st1" width="5.6" height="1.6"/>
569
+ <rect x="7" y="21.9" class="st1" width="5.6" height="1.6"/>
570
+ </g>
571
+ <g id="二次过街-西" class="st0">
572
+ <g id="西下"
573
+ :class="peoplestatus[8].isshow? '' : 'invisible'"
574
+ >
575
+ <rect x="7" y="26.9" class="st1" width="5.6" height="1.6"/>
576
+ <rect x="7" y="29.4" class="st1" width="5.6" height="1.6"/>
577
+ <rect x="7" y="31.9" class="st1" width="5.6" height="1.6"/>
578
+ <rect x="7" y="34.4" class="st1" width="5.6" height="1.6"/>
579
+ <rect x="7" y="36.9" class="st1" width="5.6" height="1.6"/>
580
+ <rect x="7" y="39.4" class="st1" width="5.6" height="1.6"/>
581
+ </g>
582
+ <g id="西上"
583
+ :class="peoplestatus[9].isshow? '' : 'invisible'"
584
+ >
585
+ <rect x="7" y="14.5" class="st1" width="5.6" height="1.6"/>
586
+ <rect x="7" y="12" class="st1" width="5.6" height="1.6"/>
587
+ <rect x="7" y="9.5" class="st1" width="5.6" height="1.6"/>
588
+ <rect x="7" y="7" class="st1" width="5.6" height="1.6"/>
589
+ <rect x="7" y="17" class="st1" width="5.6" height="1.6"/>
590
+ <rect x="7" y="19.5" class="st1" width="5.6" height="1.6"/>
591
+ </g>
592
+ </g>
593
+ <g id="二次过街-东" class="st0">
594
+ <g id="东上"
595
+ :class="peoplestatus[10].isshow? '' : 'invisible'"
596
+ >
597
+ <rect x="35.4" y="19.5" class="st1" width="5.6" height="1.6"/>
598
+ <rect x="35.4" y="17" class="st1" width="5.6" height="1.6"/>
599
+ <rect x="35.4" y="14.5" class="st1" width="5.6" height="1.6"/>
600
+ <rect x="35.4" y="12" class="st1" width="5.6" height="1.6"/>
601
+ <rect x="35.4" y="9.5" class="st1" width="5.6" height="1.6"/>
602
+ <rect x="35.4" y="7" class="st1" width="5.6" height="1.6"/>
603
+ </g>
604
+ <g id="东下"
605
+ :class="peoplestatus[11].isshow? '' : 'invisible'"
606
+ >
607
+ <rect x="35.4" y="31.9" class="st1" width="5.6" height="1.6"/>
608
+ <rect x="35.4" y="34.4" class="st1" width="5.6" height="1.6"/>
609
+ <rect x="35.4" y="36.9" class="st1" width="5.6" height="1.6"/>
610
+ <rect x="35.4" y="39.4" class="st1" width="5.6" height="1.6"/>
611
+ <rect x="35.4" y="29.4" class="st1" width="5.6" height="1.6"/>
612
+ <rect x="35.4" y="26.9" class="st1" width="5.6" height="1.6"/>
613
+ </g>
614
+ </g>
615
+ <g id="二次过街-南" class="st0">
616
+ <g id="南右"
617
+ :class="peoplestatus[12].isshow? '' : 'invisible'"
618
+ >
619
+ <rect x="26.9" y="35.4" class="st1" width="1.6" height="5.6"/>
620
+ <rect x="29.4" y="35.4" class="st1" width="1.6" height="5.6"/>
621
+ <rect x="31.9" y="35.4" class="st1" width="1.6" height="5.6"/>
622
+ <rect x="34.4" y="35.4" class="st1" width="1.6" height="5.6"/>
623
+ <rect x="36.9" y="35.4" class="st1" width="1.6" height="5.6"/>
624
+ <rect x="39.4" y="35.4" class="st1" width="1.6" height="5.6"/>
625
+ </g>
626
+ <g id="南左"
627
+ :class="peoplestatus[13].isshow? '' : 'invisible'"
628
+ >
629
+ <rect x="14.5" y="35.4" class="st1" width="1.6" height="5.6"/>
630
+ <rect x="12" y="35.4" class="st1" width="1.6" height="5.6"/>
631
+ <rect x="9.5" y="35.4" class="st1" width="1.6" height="5.6"/>
632
+ <rect x="7" y="35.4" class="st1" width="1.6" height="5.6"/>
633
+ <rect x="17" y="35.4" class="st1" width="1.6" height="5.6"/>
634
+ <rect x="19.5" y="35.4" class="st1" width="1.6" height="5.6"/>
635
+ </g>
636
+ </g>
637
+ <g id="二次过街-北_1_" class="st0">
638
+ <g id="北右_1_"
639
+ :class="peoplestatus[14].isshow? '' : 'invisible'"
640
+ >
641
+ <rect x="26.9" y="7" class="st1" width="1.6" height="5.6"/>
642
+ <rect x="29.4" y="7" class="st1" width="1.6" height="5.6"/>
643
+ <rect x="31.9" y="7" class="st1" width="1.6" height="5.6"/>
644
+ <rect x="34.4" y="7" class="st1" width="1.6" height="5.6"/>
645
+ <rect x="36.9" y="7" class="st1" width="1.6" height="5.6"/>
646
+ <rect x="39.4" y="7" class="st1" width="1.6" height="5.6"/>
647
+ </g>
648
+ <g id="北左_1_"
649
+ :class="peoplestatus[15].isshow? '' : 'invisible'"
650
+ >
651
+ <rect x="14.5" y="7" class="st1" width="1.6" height="5.6"/>
652
+ <rect x="12" y="7" class="st1" width="1.6" height="5.6"/>
653
+ <rect x="9.5" y="7" class="st1" width="1.6" height="5.6"/>
654
+ <rect x="7" y="7" class="st1" width="1.6" height="5.6"/>
655
+ <rect x="17" y="7" class="st1" width="1.6" height="5.6"/>
656
+ <rect x="19.5" y="7" class="st1" width="1.6" height="5.6"/>
657
+ </g>
658
+ </g>
659
+ </g>
660
+ </svg>
563
661
  </div>
662
+ </div>
564
663
  </template>
565
664
  <script>
566
- // import { mapState } from 'vuex'
665
+ import { mapState } from 'vuex'
567
666
  export default {
568
667
  name: 'xdr-dir-selector',
569
668
  props: {
@@ -602,20 +701,15 @@ export default {
602
701
  type: String,
603
702
  default: '#0096ba'
604
703
  },
605
- roadDirection: {
606
- type: String,
607
- default: 'right'
608
- },
609
704
  Data: {
610
705
  type: Object
611
706
  }
612
-
613
707
  },
614
- // computed: {
615
- // ...mapState({
616
- // roadDirection: state => state.globalParam.roadDirection
617
- // })
618
- // },
708
+ computed: {
709
+ ...mapState({
710
+ roadDirection: state => state.globalParam.roadDirection
711
+ })
712
+ },
619
713
  data () {
620
714
  return {
621
715
  maskmark: false,
@@ -715,6 +809,78 @@ export default {
715
809
  name: '北人行横道-左',
716
810
  isshow: false,
717
811
  color: '#0096ba'
812
+ },
813
+ {
814
+ id: 17,
815
+ name: '东南人行横道',
816
+ isshow: false,
817
+ color: '#0096ba'
818
+ },
819
+ {
820
+ id: 18,
821
+ name: '西南人行横道',
822
+ isshow: false,
823
+ color: '#0096ba'
824
+ },
825
+ {
826
+ id: 19,
827
+ name: '东北人行横道',
828
+ isshow: false,
829
+ color: '#0096ba'
830
+ },
831
+ {
832
+ id: 20,
833
+ name: '西北人行横道',
834
+ isshow: false,
835
+ color: '#0096ba'
836
+ },
837
+ {
838
+ id: 21,
839
+ name: '东南人行横道-上',
840
+ isshow: false,
841
+ color: '#0096ba'
842
+ },
843
+ {
844
+ id: 22,
845
+ name: '东南人行横道-下',
846
+ isshow: false,
847
+ color: '#0096ba'
848
+ },
849
+ {
850
+ id: 23,
851
+ name: '西南人行横道-上',
852
+ isshow: false,
853
+ color: '#0096ba'
854
+ },
855
+ {
856
+ id: 24,
857
+ name: '西南人行横道-下',
858
+ isshow: false,
859
+ color: '#0096ba'
860
+ },
861
+ {
862
+ id: 25,
863
+ name: '东北人行横道-上',
864
+ isshow: false,
865
+ color: '#0096ba'
866
+ },
867
+ {
868
+ id: 26,
869
+ name: '东北人行横道-下',
870
+ isshow: false,
871
+ color: '#0096ba'
872
+ },
873
+ {
874
+ id: 27,
875
+ name: '西北人行横道-上',
876
+ isshow: false,
877
+ color: '#0096ba'
878
+ },
879
+ {
880
+ id: 28,
881
+ name: '西北人行横道-下',
882
+ isshow: false,
883
+ color: '#0096ba'
718
884
  }
719
885
  ],
720
886
  status: [
@@ -813,6 +979,102 @@ export default {
813
979
  name: 'South-Back',
814
980
  isshow: false,
815
981
  color: '#0096ba'
982
+ },
983
+ {
984
+ id: 17,
985
+ name: 'Straight-Southeast',
986
+ isshow: false,
987
+ color: '#0096ba'
988
+ },
989
+ {
990
+ id: 18,
991
+ name: 'Southeast-Left',
992
+ isshow: false,
993
+ color: '#0096ba'
994
+ },
995
+ {
996
+ id: 19,
997
+ name: 'Southeast-Right',
998
+ isshow: false,
999
+ color: '#0096ba'
1000
+ },
1001
+ {
1002
+ id: 20,
1003
+ name: 'Turn-Southeast',
1004
+ isshow: false,
1005
+ color: '#0096ba'
1006
+ },
1007
+ {
1008
+ id: 21,
1009
+ name: 'Straight-Southwest',
1010
+ isshow: false,
1011
+ color: '#0096ba'
1012
+ },
1013
+ {
1014
+ id: 22,
1015
+ name: 'Southwest-Left',
1016
+ isshow: false,
1017
+ color: '#0096ba'
1018
+ },
1019
+ {
1020
+ id: 23,
1021
+ name: 'Southwest-Right',
1022
+ isshow: false,
1023
+ color: '#0096ba'
1024
+ },
1025
+ {
1026
+ id: 24,
1027
+ name: 'Turn-Southwest',
1028
+ isshow: false,
1029
+ color: '#0096ba'
1030
+ },
1031
+ {
1032
+ id: 25,
1033
+ name: 'Straight-Northeast',
1034
+ isshow: false,
1035
+ color: '#0096ba'
1036
+ },
1037
+ {
1038
+ id: 26,
1039
+ name: 'Northeast-Left',
1040
+ isshow: false,
1041
+ color: '#0096ba'
1042
+ },
1043
+ {
1044
+ id: 27,
1045
+ name: 'Northeast-Right-Turn',
1046
+ isshow: false,
1047
+ color: '#0096ba'
1048
+ },
1049
+ {
1050
+ id: 28,
1051
+ name: 'Turn-Northeast',
1052
+ isshow: false,
1053
+ color: '#0096ba'
1054
+ },
1055
+ {
1056
+ id: 29,
1057
+ name: 'Straight-Northwest',
1058
+ isshow: false,
1059
+ color: '#0096ba'
1060
+ },
1061
+ {
1062
+ id: 30,
1063
+ name: 'Northwest-Left-Turn',
1064
+ isshow: false,
1065
+ color: '#0096ba'
1066
+ },
1067
+ {
1068
+ id: 31,
1069
+ name: 'Northwest-Right-Turn',
1070
+ isshow: false,
1071
+ color: '#0096ba'
1072
+ },
1073
+ {
1074
+ id: 32,
1075
+ name: 'Turn-Northwest',
1076
+ isshow: false,
1077
+ color: '#0096ba'
816
1078
  }
817
1079
  ]
818
1080
  }
@@ -830,6 +1092,7 @@ export default {
830
1092
  }
831
1093
  }
832
1094
  },
1095
+ // 车道
833
1096
  refreshShow (showList) {
834
1097
  if (showList.length > 16) {
835
1098
  console.log('list can not be bigger than 16!')
@@ -841,16 +1104,16 @@ export default {
841
1104
  }
842
1105
  }
843
1106
 
844
- for (let i = 0; i < 16; i++) {
1107
+ for (let i = 0; i < 32; i++) {
845
1108
  if (this.status[i].isshow) {
846
1109
  this.status[i].isshow = false
847
1110
  }
848
1111
  }
849
- for (let i = 0; i < 16; i++) {
1112
+ for (let i = 0; i < 32; i++) {
850
1113
  if (i < showList.length) {
851
1114
  let id = showList[i].id
852
1115
  if (!id) return
853
- if (id > 16 || id <= 0) {
1116
+ if (id > 32 || id <= 0) {
854
1117
  console.log('Id is invalied!')
855
1118
  continue
856
1119
  }
@@ -859,8 +1122,10 @@ export default {
859
1122
  }
860
1123
  }
861
1124
  },
1125
+ // 人行横道
862
1126
  refreshShows (showlist) {
863
- for (let i = 0; i < 16; i++) {
1127
+ if (showlist.length === 0) return
1128
+ for (let i = 0; i < 28; i++) {
864
1129
  if (this.peoplestatus[i].isshow) {
865
1130
  this.peoplestatus[i].isshow = false
866
1131
  }