feat(map): 替换地图标记为三轮车图标
- 在 location.tsx 中导入并使用三轮车图标替代原有加标记点 - 在 trajectory.tsx 中导入并使用同样的三轮车图标替代原有加标记点 - 设置标记图标宽高为 32,确保图标在地图中正确显示和居中 - 统一地图上所有车辆标记使用送快递三轮车图标,提高视觉识别度
This commit is contained in:
@@ -22,6 +22,12 @@
|
||||
- 添加图标导入:`import tricycleIcon from '@/assets/icons/delivery_tricycle.png'`
|
||||
- markers 添加:`iconPath: tricycleIcon, width: 32, height: 32`
|
||||
|
||||
4. **修改 pages/index/index.tsx(首页)**
|
||||
- 文件:`src/pages/index/index.tsx`
|
||||
- 添加图标导入:`import tricycleIcon from '@/assets/icons/delivery_tricycle.png'`
|
||||
- 第 244 行和第 319 行的 markers 添加:`iconPath: tricycleIcon, width: 32, height: 32`
|
||||
- 该文件有两处设置 markers(pageHjmCarByMap 函数和 reload 函数)
|
||||
|
||||
### 注意事项
|
||||
- TypeScript 类型定义已包含 PNG 模块声明,无需额外配置
|
||||
- 微信小程序 map 组件需要指定 width 和 height 属性
|
||||
|
||||
@@ -14,6 +14,7 @@ import {pageByQQMap, pageHjmCar} from "@/api/hjm/hjmCar";
|
||||
import {HjmCar} from "@/api/hjm/hjmCar/model";
|
||||
// 导入GPS坐标转换工具
|
||||
import GPS from '@/utils/gpsUtil.js';
|
||||
import tricycleIcon from '@/assets/icons/delivery_tricycle.png';
|
||||
|
||||
export interface Market {
|
||||
// 自增ID
|
||||
@@ -240,6 +241,9 @@ function Home() {
|
||||
id: item.id,
|
||||
latitude: markerLat,
|
||||
longitude: markerLng,
|
||||
iconPath: tricycleIcon,
|
||||
width: 32,
|
||||
height: 32,
|
||||
label: {
|
||||
content: `${item?.code}`,
|
||||
color: '#000000',
|
||||
@@ -312,6 +316,9 @@ function Home() {
|
||||
id: data.id,
|
||||
latitude: displayLat,
|
||||
longitude: displayLng,
|
||||
iconPath: tricycleIcon,
|
||||
width: 32,
|
||||
height: 32,
|
||||
// @ts-ignore
|
||||
label: {
|
||||
content: `${data?.code}`,
|
||||
|
||||
Reference in New Issue
Block a user