Hooke / map-demo

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
91d62804 1 parent e0a56c24

fix(map): 修复地图标记文字显示问题 

- 将无效的 writing-mode: "horizontal" 修正为 "horizontal-tb"
- 添加 white-space: nowrap 防止文字换行截断
- 影响文件: by/map.vue, bieyuan/map.vue, checkin/map.vue

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Inline Side-by-side
Showing 4 changed files with 20 additions and 15 deletions
...@@ -232,13 +232,13 @@ export default { ...@@ -232,13 +232,13 @@ export default {
232 "border-color": "#DD7850", 232 "border-color": "#DD7850",
233 "border-radius": ".25rem", 233 "border-radius": ".25rem",
234 "background-color": "#FFF", 234 "background-color": "#FFF",
235 - // "width": "1rem", 235 + "white-space": "nowrap",
236 // "border-width": 0, 236 // "border-width": 0,
237 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)", 237 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)",
238 // "text-align": "center", 238 // "text-align": "center",
239 "font-size": "0.8rem", 239 "font-size": "0.8rem",
240 "color": "#DD7850", 240 "color": "#DD7850",
241 - "writing-mode": "horizontal", 241 + "writing-mode": "horizontal-tb",
242 "text-orientation": "mixed", 242 "text-orientation": "mixed",
243 "display": "flex", 243 "display": "flex",
244 "justify-content": "center", 244 "justify-content": "center",
...@@ -251,13 +251,13 @@ export default { ...@@ -251,13 +251,13 @@ export default {
251 "border-color": "#fcfbfa", 251 "border-color": "#fcfbfa",
252 "border-radius": ".25rem", 252 "border-radius": ".25rem",
253 "background-color": "#DD7850", 253 "background-color": "#DD7850",
254 - // "width": "1rem", 254 + "white-space": "nowrap",
255 // "border-width": 0, 255 // "border-width": 0,
256 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)", 256 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)",
257 // "text-align": "center", 257 // "text-align": "center",
258 "font-size": "0.8rem", 258 "font-size": "0.8rem",
259 "color": "white", 259 "color": "white",
260 - "writing-mode": "horizontal", 260 + "writing-mode": "horizontal-tb",
261 "text-orientation": "mixed", 261 "text-orientation": "mixed",
262 "display": "flex", 262 "display": "flex",
263 "justify-content": "center", 263 "justify-content": "center",
......
...@@ -243,13 +243,13 @@ export default { ...@@ -243,13 +243,13 @@ export default {
243 "border-color": "#DD7850", 243 "border-color": "#DD7850",
244 "border-radius": ".25rem", 244 "border-radius": ".25rem",
245 "background-color": "#FFF", 245 "background-color": "#FFF",
246 - // "width": "1rem", 246 + "white-space": "nowrap",
247 // "border-width": 0, 247 // "border-width": 0,
248 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)", 248 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)",
249 // "text-align": "center", 249 // "text-align": "center",
250 "font-size": "0.8rem", 250 "font-size": "0.8rem",
251 "color": "#DD7850", 251 "color": "#DD7850",
252 - "writing-mode": "horizontal", 252 + "writing-mode": "horizontal-tb",
253 "text-orientation": "mixed", 253 "text-orientation": "mixed",
254 "display": "flex", 254 "display": "flex",
255 "justify-content": "center", 255 "justify-content": "center",
...@@ -262,13 +262,13 @@ export default { ...@@ -262,13 +262,13 @@ export default {
262 "border-color": "#fcfbfa", 262 "border-color": "#fcfbfa",
263 "border-radius": ".25rem", 263 "border-radius": ".25rem",
264 "background-color": "#DD7850", 264 "background-color": "#DD7850",
265 - // "width": "1rem", 265 + "white-space": "nowrap",
266 // "border-width": 0, 266 // "border-width": 0,
267 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)", 267 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)",
268 // "text-align": "center", 268 // "text-align": "center",
269 "font-size": "0.8rem", 269 "font-size": "0.8rem",
270 "color": "white", 270 "color": "white",
271 - "writing-mode": "horizontal", 271 + "writing-mode": "horizontal-tb",
272 "text-orientation": "mixed", 272 "text-orientation": "mixed",
273 "display": "flex", 273 "display": "flex",
274 "justify-content": "center", 274 "justify-content": "center",
......
...@@ -7,6 +7,9 @@ ...@@ -7,6 +7,9 @@
7 7
8 | ID | Time | T | Title | Read | 8 | ID | Time | T | Title | Read |
9 |----|------|---|-------|------| 9 |----|------|---|-------|------|
10 +| #5670 | 2:37 PM | 🔴 | All horizontal marker styles fixed in checkin/map.vue | ~247 |
11 +| #5657 | 2:32 PM | 🔴 | Fixed invalid CSS writing-mode in checkin/map.vue computed property | ~257 |
12 +| #5655 | 2:31 PM | 🔵 | Found 4 instances of invalid writing-mode in checkin/map.vue | ~197 |
10 | #5329 | 11:25 AM | ✅ | CLAUDE.md memory log updated with recent observations | ~221 | 13 | #5329 | 11:25 AM | ✅ | CLAUDE.md memory log updated with recent observations | ~221 |
11 | #5327 | 11:24 AM | 🔴 | Map marker navigation parameter fix committed to git | ~254 | 14 | #5327 | 11:24 AM | 🔴 | Map marker navigation parameter fix committed to git | ~254 |
12 | #5325 | 11:20 AM | 🔄 | Removed duplicate discountTitle variable declaration in onMounted hook | ~218 | 15 | #5325 | 11:20 AM | 🔄 | Removed duplicate discountTitle variable declaration in onMounted hook | ~218 |
......
1 <!-- 1 <!--
2 * @Date: 2023-05-19 14:54:27 2 * @Date: 2023-05-19 14:54:27
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2026-02-10 11:23:01 4 + * @LastEditTime: 2026-02-10 13:58:46
5 * @FilePath: /map-demo/src/views/checkin/map.vue 5 * @FilePath: /map-demo/src/views/checkin/map.vue
6 * @Description: 公众地图主体页面 6 * @Description: 公众地图主体页面
7 --> 7 -->
...@@ -406,11 +406,12 @@ export default { ...@@ -406,11 +406,12 @@ export default {
406 "background-color": "#FFF", 406 "background-color": "#FFF",
407 "font-size": getAdaptiveFontSize(0.8, true), // 仅iPad设备适配 407 "font-size": getAdaptiveFontSize(0.8, true), // 仅iPad设备适配
408 "color": "#DD7850", 408 "color": "#DD7850",
409 - "writing-mode": "horizontal", 409 + "writing-mode": "horizontal-tb",
410 "text-orientation": "mixed", 410 "text-orientation": "mixed",
411 "display": "flex", 411 "display": "flex",
412 "justify-content": "center", 412 "justify-content": "center",
413 "align-items": "center", 413 "align-items": "center",
414 + "white-space": "nowrap",
414 }; 415 };
415 }, 416 },
416 /** 417 /**
...@@ -425,11 +426,12 @@ export default { ...@@ -425,11 +426,12 @@ export default {
425 "background-color": "#DD7850", 426 "background-color": "#DD7850",
426 "font-size": getAdaptiveFontSize(0.8, true), // 仅iPad设备适配 427 "font-size": getAdaptiveFontSize(0.8, true), // 仅iPad设备适配
427 "color": "white", 428 "color": "white",
428 - "writing-mode": "horizontal", 429 + "writing-mode": "horizontal-tb",
429 "text-orientation": "mixed", 430 "text-orientation": "mixed",
430 "display": "flex", 431 "display": "flex",
431 "justify-content": "center", 432 "justify-content": "center",
432 "align-items": "center", 433 "align-items": "center",
434 + "white-space": "nowrap",
433 }; 435 };
434 } 436 }
435 }, 437 },
...@@ -518,13 +520,13 @@ export default { ...@@ -518,13 +520,13 @@ export default {
518 "border-color": "#DD7850", 520 "border-color": "#DD7850",
519 "border-radius": ".25rem", 521 "border-radius": ".25rem",
520 "background-color": "#FFF", 522 "background-color": "#FFF",
521 - // "width": "1rem", 523 + "white-space": "nowrap",
522 // "border-width": 0, 524 // "border-width": 0,
523 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)", 525 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)",
524 // "text-align": "center", 526 // "text-align": "center",
525 "font-size": "0.8rem", 527 "font-size": "0.8rem",
526 "color": "#DD7850", 528 "color": "#DD7850",
527 - "writing-mode": "horizontal", 529 + "writing-mode": "horizontal-tb",
528 "text-orientation": "mixed", 530 "text-orientation": "mixed",
529 "display": "flex", 531 "display": "flex",
530 "justify-content": "center", 532 "justify-content": "center",
...@@ -537,13 +539,13 @@ export default { ...@@ -537,13 +539,13 @@ export default {
537 "border-color": "#fcfbfa", 539 "border-color": "#fcfbfa",
538 "border-radius": ".25rem", 540 "border-radius": ".25rem",
539 "background-color": "#DD7850", 541 "background-color": "#DD7850",
540 - // "width": "1rem", 542 + "white-space": "nowrap",
541 // "border-width": 0, 543 // "border-width": 0,
542 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)", 544 // "box-shadow": "0 2px 6px 0 rgba(114, 124, 245, .5)",
543 // "text-align": "center", 545 // "text-align": "center",
544 "font-size": "0.8rem", 546 "font-size": "0.8rem",
545 "color": "white", 547 "color": "white",
546 - "writing-mode": "horizontal", 548 + "writing-mode": "horizontal-tb",
547 "text-orientation": "mixed", 549 "text-orientation": "mixed",
548 "display": "flex", 550 "display": "flex",
549 "justify-content": "center", 551 "justify-content": "center",
......