feat(map): 替换地图标记为三轮车图标

- 在 location.tsx 中导入并使用三轮车图标替代原有加标记点
- 在 trajectory.tsx 中导入并使用同样的三轮车图标替代原有加标记点
- 设置标记图标宽高为 32,确保图标在地图中正确显示和居中
- 统一地图上所有车辆标记使用送快递三轮车图标,提高视觉识别度
This commit is contained in:
2026-05-07 17:20:42 +08:00
parent 6136851ade
commit 16b09eb271
4 changed files with 36 additions and 3 deletions

View File

@@ -0,0 +1,28 @@
# 2026-05-07 工作记忆
## 地图标记图标修改
### 任务
将地图上的小红点改成送快递的三轮车图标
### 修改内容
1. **创建三轮车图标**
- 位置:`src/assets/icons/delivery_tricycle.png`
- 尺寸64x64 透明背景 PNG
- 设计:红色车身、绿色货箱的三轮快递车
2. **修改 location.tsx**
- 文件:`src/hjm/location.tsx`
- 添加图标导入:`import tricycleIcon from '@/assets/icons/delivery_tricycle.png'`
- markers 添加:`iconPath: tricycleIcon, width: 32, height: 32`
3. **修改 trajectory.tsx**
- 文件:`src/hjm/trajectory/trajectory.tsx`
- 添加图标导入:`import tricycleIcon from '@/assets/icons/delivery_tricycle.png'`
- markers 添加:`iconPath: tricycleIcon, width: 32, height: 32`
### 注意事项
- TypeScript 类型定义已包含 PNG 模块声明,无需额外配置
- 微信小程序 map 组件需要指定 width 和 height 属性
- 图标居中显示在车辆 GPS 坐标位置

Binary file not shown.

After

Width:  |  Height:  |  Size: 704 B

View File

@@ -5,8 +5,8 @@ import {Button, Input} from '@nutui/nutui-react-taro'
import {useRouter} from '@tarojs/taro'
import {getHjmCarByCode} from "@/api/hjm/hjmCar";
import {HjmCar} from "@/api/hjm/hjmCar/model";
// 导入整个GPS对象因为gpsUtil.js导出的是一个对象而不是命名导出
import GPS from '@/utils/gpsUtil.js';
import tricycleIcon from '@/assets/icons/delivery_tricycle.png';
import './location.scss'
/**
@@ -344,7 +344,9 @@ const Location = () => {
id: 1,
latitude: latitude,
longitude: longitude,
iconPath: '',
iconPath: tricycleIcon,
width: 32,
height: 32,
label: {
content: item.code || '',
color: '#ffffff',

View File

@@ -7,8 +7,8 @@ import {HjmCar} from "@/api/hjm/hjmCar/model";
import './trajectory.scss'
import {pageHjmGpsLog} from "@/api/hjm/hjmGpsLog";
import {formatCurrentDate, getCurrentHour} from "@/utils/time";
// 导入GPS坐标转换工具
import GPS from '@/utils/gpsUtil.js';
import tricycleIcon from '@/assets/icons/delivery_tricycle.png';
/**
* 文章终极列表
@@ -313,6 +313,9 @@ const Location = () => {
},
latitude: latitude,
longitude: longitude,
iconPath: tricycleIcon,
width: 32,
height: 32,
// @ts-ignore
name: '位置'
}]}