Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: [harmony-hybrid]同层渲染Map组件新增Marker属性支持。 #15805

Merged
merged 4 commits into from
May 31, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 13 additions & 12 deletions examples/mini-program-example/src/pages/component/map/map.js
Original file line number Diff line number Diff line change
Expand Up @@ -44,13 +44,13 @@ export default class PageView extends React.Component {
markers: [
{
id: 8888888888,
latitude: 39.914887,
longitude: 116.403694,
title: '北京天安门',
iconPath: 'https://img1.baidu.com/it/u=4261206956,1866846027&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=415',
latitude: 39.916348,
longitude: 116.404999,
title: '北京市第二十七中学',
iconPath: 'https://img.58cdn.com.cn/git/tcb/mini-img/wx/wanliqiu/map-1.png',
rotate: 0,
width: 20,
height: 20,
width: 120,
height: 120,
callout: {
content: '我在天安门!',
color: '#ffffff',
Expand Down Expand Up @@ -81,14 +81,14 @@ export default class PageView extends React.Component {
},
{
id: 666666666,
latitude: 38.914887,
longitude: 116.403694,
title: '北京天安门',
latitude: 39.913834,
longitude: 116.403427,
title: '南池子美术馆',
zIndex: 999,
iconPath: 'https://img1.baidu.com/it/u=4261206956,1866846027&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=415',
iconPath: 'https://img.58cdn.com.cn/git/tcb/mini-img/wx/wanliqiu/map-1.png',
rotate: 0,
width: 20,
height: 20,
width: 120,
height: 120,
callout: {
content: 'hahhaa天安门!',
color: '#ffffff',
Expand Down Expand Up @@ -699,6 +699,7 @@ export default class PageView extends React.Component {
showCompass={this.state.showCompass}
showLocation={this.state.showLocation}
enableTraffic={this.state.enableTraffic}
markers={this.state.markers}
onTap={this.handleOnTap}
onMarkerTap={this.handleOnMarkerTap}
onCalloutTap={this.handleOnCalloutTap}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,21 @@
import React from 'react'

interface marker {
latitude: number
longitude: number
title?: string
zIndex?: number // 图标所在层级
iconPath?: string // 图标路径,当前仅支持base64图片
rotate?: number // 图标旋转角度
alpha?: number // 图标透明度,取值范围为0-1
width?: number // 图标宽度
height?: number // 图标高度
anchor?: {
x: number // 锚点X坐标,范围0-1
y: number // 锚点Y坐标,范围0-1
}
}

interface IProps extends React.HTMLAttributes<HTMLDivElement> {
latitude: number
longitude: number
Expand All @@ -15,6 +31,7 @@ interface IProps extends React.HTMLAttributes<HTMLDivElement> {
showScale?: boolean // 显示比例尺
showLocation?: boolean // 显示当前定位点
enableTraffic?: boolean // 是否显示路况图层
markers?: marker[] // 标记点
onTap?: (e: any) => void // 点击地图时触发
onMarkerTap?: (e: any) => void // 点击marker时触发
onCalloutTap?: (e: any) => void // 点击气泡时触发
Expand Down Expand Up @@ -49,6 +66,7 @@ class HosMap extends React.Component<IProps> {
showScale,
showLocation,
enableTraffic,
markers,
onTap,
onMarkerTap,
onCalloutTap,
Expand Down Expand Up @@ -76,6 +94,7 @@ class HosMap extends React.Component<IProps> {
scaleControlsEnabled: showScale,
setMyLocationEnabled: showLocation,
setTrafficEnabled: enableTraffic,
markers,
onMapClick: onTap,
onMarkerClick: onMarkerTap,
onBubbleClick: onCalloutTap,
Expand Down
Loading