Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Velpro187
uni-app
提交
ec5088f7
U
uni-app
项目概览
Velpro187
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
ec5088f7
编写于
4月 20, 2022
作者:
Q
qiang
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
fix(H5): map polyline/circles color (fixed #3433)
上级
c8694250
变更
4
隐藏空白更改
内联
并排
Showing
4 changed file
with
57 addition
and
33 deletion
+57
-33
packages/uni-h5/src/view/components/map/MapCircle.tsx
packages/uni-h5/src/view/components/map/MapCircle.tsx
+18
-21
packages/uni-h5/src/view/components/map/MapPolyline.tsx
packages/uni-h5/src/view/components/map/MapPolyline.tsx
+30
-11
packages/uni-h5/src/view/components/map/maps/google/types.d.ts
...ges/uni-h5/src/view/components/map/maps/google/types.d.ts
+3
-1
packages/uni-h5/src/view/components/map/maps/types.ts
packages/uni-h5/src/view/components/map/maps/types.ts
+6
-0
未找到文件。
packages/uni-h5/src/view/components/map/MapCircle.tsx
浏览文件 @
ec5088f7
import
{
inject
,
onUnmounted
,
watch
}
from
'
vue
'
import
{
inject
,
onUnmounted
,
watch
}
from
'
vue
'
import
{
defineSystemComponent
,
useCustomEvent
}
from
'
@dcloudio/uni-components
'
import
{
defineSystemComponent
,
useCustomEvent
}
from
'
@dcloudio/uni-components
'
import
{
Maps
,
Map
,
Circle
}
from
'
./maps
'
import
{
Maps
,
Map
,
Circle
,
CircleOptions
}
from
'
./maps
'
import
{
hexToRgba
}
from
'
../../../helpers/hexToRgba
'
const
props
=
{
const
props
=
{
latitude
:
{
type
:
[
Number
,
String
],
require
:
true
},
latitude
:
{
type
:
[
Number
,
String
],
require
:
true
},
longitude
:
{
type
:
[
Number
,
String
],
require
:
true
},
longitude
:
{
type
:
[
Number
,
String
],
require
:
true
},
color
:
{
type
:
String
,
default
:
''
},
color
:
{
type
:
String
,
default
:
'
#000000
'
},
fillColor
:
{
type
:
String
,
default
:
''
},
fillColor
:
{
type
:
String
,
default
:
'
#00000000
'
},
radius
:
{
type
:
[
Number
,
String
],
require
:
true
},
radius
:
{
type
:
[
Number
,
String
],
require
:
true
},
strokeWidth
:
{
type
:
[
Number
,
String
],
default
:
''
},
strokeWidth
:
{
type
:
[
Number
,
String
],
default
:
''
},
level
:
{
type
:
String
,
default
:
''
},
level
:
{
type
:
String
,
default
:
''
},
...
@@ -39,30 +40,26 @@ export default /*#__PURE__*/ defineSystemComponent({
...
@@ -39,30 +40,26 @@ export default /*#__PURE__*/ defineSystemComponent({
}
}
function
addCircle
(
option
:
Props
)
{
function
addCircle
(
option
:
Props
)
{
const
center
=
new
maps
.
LatLng
(
option
.
latitude
,
option
.
longitude
)
const
center
=
new
maps
.
LatLng
(
option
.
latitude
,
option
.
longitude
)
function
getColor
(
color
:
string
)
{
const
circleOptions
:
CircleOptions
=
{
const
c
=
color
&&
color
.
match
(
/#
[
0-9A-Fa-f
]{6}([
0-9A-Fa-f
]{2})?
/
)
if
(
'
Color
'
in
maps
)
{
if
(
c
&&
c
.
length
)
{
return
maps
.
Color
.
fromHex
(
c
[
0
],
Number
(
'
0x
'
+
c
[
1
]
||
255
)
/
255
).
toRGBA
()
}
else
{
return
undefined
}
}
return
color
}
circle
=
new
maps
.
Circle
({
map
:
map
as
any
,
map
:
map
as
any
,
center
:
center
as
any
,
center
:
center
as
any
,
clickable
:
false
,
clickable
:
false
,
radius
:
option
.
radius
,
radius
:
option
.
radius
,
strokeWeight
:
Number
(
option
.
strokeWidth
)
||
1
,
strokeWeight
:
Number
(
option
.
strokeWidth
)
||
1
,
fillColor
:
getColor
(
option
.
fillColor
)
||
getColor
(
'
#00000001
'
),
strokeColor
:
getColor
(
option
.
color
)
||
'
#000000
'
,
strokeDashStyle
:
'
solid
'
,
strokeDashStyle
:
'
solid
'
,
})
}
const
{
r
:
fr
,
g
:
fg
,
b
:
fb
,
a
:
fa
}
=
hexToRgba
(
option
.
fillColor
)
const
{
r
:
sr
,
g
:
sg
,
b
:
sb
,
a
:
sa
}
=
hexToRgba
(
option
.
color
)
if
(
'
Color
'
in
maps
)
{
circleOptions
.
fillColor
=
new
maps
.
Color
(
fr
,
fg
,
fb
,
fa
)
as
any
circleOptions
.
strokeColor
=
new
maps
.
Color
(
sr
,
sg
,
sb
,
sa
)
as
any
}
else
{
circleOptions
.
fillColor
=
`rgb(
${
fr
}
,
${
fg
}
,
${
fb
}
)`
circleOptions
.
fillOpacity
=
fa
circleOptions
.
strokeColor
=
`rgb(
${
sr
}
,
${
sg
}
,
${
sb
}
)`
circleOptions
.
strokeOpacity
=
sa
}
circle
=
new
maps
.
Circle
(
circleOptions
)
}
}
addCircle
(
props
as
Props
)
addCircle
(
props
as
Props
)
watch
(
props
,
updateCircle
)
watch
(
props
,
updateCircle
)
...
...
packages/uni-h5/src/view/components/map/MapPolyline.tsx
浏览文件 @
ec5088f7
import
{
inject
,
PropType
,
onUnmounted
,
watch
}
from
'
vue
'
import
{
inject
,
PropType
,
onUnmounted
,
watch
}
from
'
vue
'
import
{
defineSystemComponent
,
useCustomEvent
}
from
'
@dcloudio/uni-components
'
import
{
defineSystemComponent
,
useCustomEvent
}
from
'
@dcloudio/uni-components
'
import
{
Maps
,
Map
,
LatLng
,
Polyline
}
from
'
./maps
'
import
{
Maps
,
Map
,
LatLng
,
Polyline
,
PolylineOptions
}
from
'
./maps
'
import
{
hexToRgba
}
from
'
../../../helpers/hexToRgba
'
interface
Point
{
interface
Point
{
latitude
:
number
latitude
:
number
...
@@ -60,25 +61,43 @@ export default /*#__PURE__*/ defineSystemComponent({
...
@@ -60,25 +61,43 @@ export default /*#__PURE__*/ defineSystemComponent({
path
.
push
(
new
maps
.
LatLng
(
point
.
latitude
,
point
.
longitude
))
path
.
push
(
new
maps
.
LatLng
(
point
.
latitude
,
point
.
longitude
))
})
})
const
strokeWeight
=
Number
(
option
.
width
)
||
1
const
strokeWeight
=
Number
(
option
.
width
)
||
1
polyline
=
new
maps
.
Polyline
({
const
{
r
:
sr
,
g
:
sg
,
b
:
sb
,
a
:
sa
}
=
hexToRgba
(
option
.
color
)
const
{
r
:
br
,
g
:
bg
,
b
:
bb
,
a
:
ba
}
=
hexToRgba
(
option
.
borderColor
)
const
polylineOptions
:
PolylineOptions
=
{
map
:
map
as
any
,
map
:
map
as
any
,
clickable
:
false
,
clickable
:
false
,
path
:
path
as
any
,
path
:
path
as
any
,
strokeWeight
,
strokeWeight
,
strokeColor
:
option
.
color
||
undefined
,
strokeColor
:
option
.
color
||
undefined
,
strokeDashStyle
:
option
.
dottedLine
?
'
dash
'
:
'
solid
'
,
strokeDashStyle
:
option
.
dottedLine
?
'
dash
'
:
'
solid
'
,
}
)
}
const
borderWidth
=
Number
(
option
.
borderWidth
)
||
0
const
borderWidth
=
Number
(
option
.
borderWidth
)
||
0
const
polylineBorderOptions
:
PolylineOptions
=
{
map
:
map
as
any
,
clickable
:
false
,
path
:
path
as
any
,
strokeWeight
:
strokeWeight
+
borderWidth
*
2
,
strokeColor
:
option
.
borderColor
||
undefined
,
strokeDashStyle
:
option
.
dottedLine
?
'
dash
'
:
'
solid
'
,
}
if
(
'
Color
'
in
maps
)
{
polylineOptions
.
strokeColor
=
new
maps
.
Color
(
sr
,
sg
,
sb
,
sa
)
as
any
polylineBorderOptions
.
strokeColor
=
new
maps
.
Color
(
br
,
bg
,
bb
,
ba
)
as
any
}
else
{
polylineOptions
.
strokeColor
=
`rgb(
${
sr
}
,
${
sg
}
,
${
sb
}
)`
polylineOptions
.
strokeOpacity
=
sa
polylineBorderOptions
.
strokeColor
=
`rgb(
${
br
}
,
${
bg
}
,
${
bb
}
)`
polylineBorderOptions
.
strokeOpacity
=
ba
}
if
(
borderWidth
)
{
if
(
borderWidth
)
{
polylineBorder
=
new
maps
.
Polyline
({
polylineBorder
=
new
maps
.
Polyline
(
polylineBorderOptions
)
map
:
map
as
any
,
clickable
:
false
,
path
:
path
as
any
,
strokeWeight
:
strokeWeight
+
borderWidth
*
2
,
strokeColor
:
option
.
borderColor
||
undefined
,
strokeDashStyle
:
option
.
dottedLine
?
'
dash
'
:
'
solid
'
,
})
}
}
polyline
=
new
maps
.
Polyline
(
polylineOptions
)
}
}
addPolyline
(
props
as
Props
)
addPolyline
(
props
as
Props
)
watch
(
props
,
updatePolyline
)
watch
(
props
,
updatePolyline
)
...
...
packages/uni-h5/src/view/components/map/maps/google/types.d.ts
浏览文件 @
ec5088f7
...
@@ -3,10 +3,12 @@ export type GoogleMaps = typeof google.maps
...
@@ -3,10 +3,12 @@ export type GoogleMaps = typeof google.maps
export
type
OverlayView
=
google
.
maps
.
OverlayView
export
type
OverlayView
=
google
.
maps
.
OverlayView
export
type
LatLng
=
google
.
maps
.
LatLng
export
type
LatLng
=
google
.
maps
.
LatLng
export
type
Polyline
=
google
.
maps
.
Polyline
export
type
Polyline
=
google
.
maps
.
Polyline
export
type
PolylineOptions
=
google
.
maps
.
PolylineOptions
export
type
Map
=
google
.
maps
.
Map
export
type
Map
=
google
.
maps
.
Map
export
type
Marker
=
google
.
maps
.
Marker
export
type
Marker
=
google
.
maps
.
Marker
export
type
Label
=
google
.
maps
.
MarkerLabel
export
type
Label
=
google
.
maps
.
MarkerLabel
export
type
Circle
=
google
.
maps
.
Circle
export
type
Circle
=
google
.
maps
.
Circle
export
type
Icon
=
google
.
maps
.
Icon
export
type
Icon
=
google
.
maps
.
Icon
export
type
Polygon
=
google
.
maps
.
Polygon
export
type
Polygon
=
google
.
maps
.
Polygon
export
type
Polygon
=
google
.
maps
.
PolygonOptions
export
type
PolygonOptions
=
google
.
maps
.
PolygonOptions
export
type
CircleOptions
=
google
.
maps
.
CircleOptions
packages/uni-h5/src/view/components/map/maps/types.ts
浏览文件 @
ec5088f7
...
@@ -2,16 +2,22 @@ import {
...
@@ -2,16 +2,22 @@ import {
Map
as
GMap
,
Map
as
GMap
,
LatLng
as
GLatLng
,
LatLng
as
GLatLng
,
Polyline
as
GPolyline
,
Polyline
as
GPolyline
,
PolylineOptions
as
GPolylineOptions
,
Circle
as
GCircle
,
Circle
as
GCircle
,
CircleOptions
as
GCircleOptions
,
}
from
'
./google/types
'
}
from
'
./google/types
'
import
{
import
{
Map
as
QMap
,
Map
as
QMap
,
LatLng
as
QLatLng
,
LatLng
as
QLatLng
,
Polyline
as
QPolyline
,
Polyline
as
QPolyline
,
PolylineOptions
as
QPolylineOptions
,
Circle
as
QCircle
,
Circle
as
QCircle
,
CircleOptions
as
QCircleOptions
,
}
from
'
./qq/types
'
}
from
'
./qq/types
'
export
type
Map
=
GMap
|
QMap
export
type
Map
=
GMap
|
QMap
export
type
LatLng
=
GLatLng
|
QLatLng
export
type
LatLng
=
GLatLng
|
QLatLng
export
type
Polyline
=
GPolyline
|
QPolyline
export
type
Polyline
=
GPolyline
|
QPolyline
export
type
PolylineOptions
=
GPolylineOptions
&
QPolylineOptions
export
type
Circle
=
GCircle
|
QCircle
export
type
Circle
=
GCircle
|
QCircle
export
type
CircleOptions
=
GCircleOptions
&
QCircleOptions
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录