Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
ChenYFan_OHHH
uni-app
提交
37390661
U
uni-app
项目概览
ChenYFan_OHHH
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
1
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
1
Issue
1
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
37390661
编写于
9月 15, 2021
作者:
Q
qiang
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat(h5): google map
上级
85ec55ff
变更
19
隐藏空白更改
内联
并排
Showing
19 changed file
with
558 addition
and
278 deletion
+558
-278
packages/shims-uni-app.d.ts
packages/shims-uni-app.d.ts
+1
-0
packages/uni-h5-vite/src/plugins/manifestJson.ts
packages/uni-h5-vite/src/plugins/manifestJson.ts
+8
-7
packages/uni-h5-vite/src/plugins/pagesJson.ts
packages/uni-h5-vite/src/plugins/pagesJson.ts
+2
-1
packages/uni-h5/dist/uni-h5.cjs.js
packages/uni-h5/dist/uni-h5.cjs.js
+84
-36
packages/uni-h5/dist/uni-h5.es.js
packages/uni-h5/dist/uni-h5.es.js
+146
-72
packages/uni-h5/package.json
packages/uni-h5/package.json
+4
-1
packages/uni-h5/src/view/components/map/MapCircle.tsx
packages/uni-h5/src/view/components/map/MapCircle.tsx
+14
-9
packages/uni-h5/src/view/components/map/MapControl.tsx
packages/uni-h5/src/view/components/map/MapControl.tsx
+2
-3
packages/uni-h5/src/view/components/map/MapLocation.tsx
packages/uni-h5/src/view/components/map/MapLocation.tsx
+2
-3
packages/uni-h5/src/view/components/map/MapMarker.tsx
packages/uni-h5/src/view/components/map/MapMarker.tsx
+98
-50
packages/uni-h5/src/view/components/map/MapPolyline.tsx
packages/uni-h5/src/view/components/map/MapPolyline.tsx
+6
-7
packages/uni-h5/src/view/components/map/index.tsx
packages/uni-h5/src/view/components/map/index.tsx
+43
-25
packages/uni-h5/src/view/components/map/maps/Callout.ts
packages/uni-h5/src/view/components/map/maps/Callout.ts
+38
-22
packages/uni-h5/src/view/components/map/maps/google/types.d.ts
...ges/uni-h5/src/view/components/map/maps/google/types.d.ts
+10
-0
packages/uni-h5/src/view/components/map/maps/index.ts
packages/uni-h5/src/view/components/map/maps/index.ts
+76
-0
packages/uni-h5/src/view/components/map/maps/qq/types.d.ts
packages/uni-h5/src/view/components/map/maps/qq/types.d.ts
+2
-2
packages/uni-h5/src/view/components/map/maps/types.ts
packages/uni-h5/src/view/components/map/maps/types.ts
+17
-0
packages/uni-h5/src/view/components/map/qqMap/index.ts
packages/uni-h5/src/view/components/map/qqMap/index.ts
+0
-40
yarn.lock
yarn.lock
+5
-0
未找到文件。
packages/shims-uni-app.d.ts
浏览文件 @
37390661
...
...
@@ -59,6 +59,7 @@ declare namespace UniApp {
tabBar
?:
TabBarOptions
subPackages
?:
{
root
:
string
}[]
qqMapKey
?:
string
googleMapKey
?:
string
// app-plus
entryPagePath
?:
string
entryPageQuery
?:
string
...
...
packages/uni-h5-vite/src/plugins/manifestJson.ts
浏览文件 @
37390661
...
...
@@ -20,8 +20,6 @@ const defaultAsync = {
suspensible
:
true
,
}
const
defaultQQMapKey
=
'
XVXBZ-NDMC4-JOGUS-XGIEE-QVHDZ-AMFV2
'
export
function
uniManifestJsonPlugin
():
Plugin
{
return
defineUniManifestJsonPlugin
((
opts
)
=>
{
return
{
...
...
@@ -45,10 +43,12 @@ export function uniManifestJsonPlugin(): Plugin {
const
sdkConfigs
=
(
h5
&&
h5
.
sdkConfigs
)
||
{}
const
qqMapKey
=
(
sdkConfigs
.
maps
&&
sdkConfigs
.
maps
.
qqmap
&&
sdkConfigs
.
maps
.
qqmap
.
key
)
||
defaultQQMapKey
sdkConfigs
.
maps
&&
sdkConfigs
.
maps
.
qqmap
&&
sdkConfigs
.
maps
.
qqmap
.
key
const
googleMapKey
=
sdkConfigs
.
maps
&&
sdkConfigs
.
maps
.
google
&&
sdkConfigs
.
maps
.
google
.
key
let
locale
:
string
|
null
|
undefined
=
manifest
.
locale
locale
=
locale
&&
locale
.
toUpperCase
()
!==
'
AUTO
'
?
locale
:
''
...
...
@@ -77,7 +77,8 @@ export function uniManifestJsonPlugin(): Plugin {
// h5
export const router =
${
JSON
.
stringify
(
router
)}
export const async =
${
JSON
.
stringify
(
async
)}
export const qqMapKey = '
${
qqMapKey
}
'
export const qqMapKey =
${
JSON
.
stringify
(
qqMapKey
)}
export const googleMapKey =
${
JSON
.
stringify
(
googleMapKey
)}
export const sdkConfigs =
${
JSON
.
stringify
(
sdkConfigs
)}
export const locale = '
${
locale
}
'
export const fallbackLocale = '
${
fallbackLocale
}
'
...
...
packages/uni-h5-vite/src/plugins/pagesJson.ts
浏览文件 @
37390661
...
...
@@ -55,7 +55,7 @@ function generatePagesJsonCode(
return
`
import { defineAsyncComponent, resolveComponent, createVNode, withCtx, openBlock, createBlock } from 'vue'
import { PageComponent, AsyncLoadingComponent, AsyncErrorComponent, useI18n, setupWindow } from '@dcloudio/uni-h5'
import { appid, debug, networkTimeout, router, async, sdkConfigs, qqMapKey, nvue, locale, fallbackLocale } from '
${
manifestJsonPath
}
'
import { appid, debug, networkTimeout, router, async, sdkConfigs, qqMapKey,
googleMapKey,
nvue, locale, fallbackLocale } from '
${
manifestJsonPath
}
'
const locales = import.meta.globEager('./locale/*.json')
${
importLayoutComponentsCode
}
const extend = Object.assign
...
...
@@ -259,6 +259,7 @@ delete ${globalName}['____'+appid+'____']
networkTimeout,
sdkConfigs,
qqMapKey,
googleMapKey,
nvue,
locale,
fallbackLocale,
...
...
packages/uni-h5/dist/uni-h5.cjs.js
浏览文件 @
37390661
...
...
@@ -7652,6 +7652,11 @@ var index$d = /* @__PURE__ */ defineBuiltInComponent({
};
}
});
var
MapType
;
(
function
(
MapType2
)
{
MapType2
[
"
QQ
"
]
=
"
qq
"
;
MapType2
[
"
GOOGLE
"
]
=
"
google
"
;
})(
MapType
||
(
MapType
=
{}));
const
props$6
=
{
id
:
{
type
:
[
Number
,
String
],
...
...
@@ -7732,8 +7737,8 @@ var MapMarker = /* @__PURE__ */ defineSystemComponent({
let
w
;
let
h
;
let
top
;
let
x
=
anchor
.
x
;
let
y
=
anchor
.
y
;
let
x
=
typeof
anchor
.
x
===
"
number
"
?
anchor
.
x
:
0.5
;
let
y
=
typeof
anchor
.
y
===
"
number
"
?
anchor
.
y
:
1
;
if
(
option
.
iconPath
&&
(
option
.
width
||
option
.
height
))
{
w
=
option
.
width
||
img
.
width
/
img
.
height
*
option
.
height
;
h
=
option
.
height
||
img
.
height
/
img
.
width
*
option
.
width
;
...
...
@@ -7741,37 +7746,53 @@ var MapMarker = /* @__PURE__ */ defineSystemComponent({
w
=
img
.
width
/
2
;
h
=
img
.
height
/
2
;
}
x
=
(
typeof
x
===
"
number
"
?
x
:
0.5
)
*
w
;
y
=
(
typeof
y
===
"
number
"
?
y
:
1
)
*
h
;
top
=
h
-
(
h
-
y
);
icon
=
new
maps
.
MarkerImage
(
img
.
src
,
null
,
null
,
new
maps
.
Point
(
x
,
y
),
new
maps
.
Size
(
w
,
h
));
if
(
"
MarkerImage
"
in
maps
)
{
icon
=
new
maps
.
MarkerImage
(
img
.
src
,
null
,
null
,
new
maps
.
Point
(
x
*
w
,
y
*
h
),
new
maps
.
Size
(
w
,
h
));
}
else
{
icon
=
{
url
:
img
.
src
,
anchor
:
new
maps
.
Point
(
x
,
y
),
size
:
new
maps
.
Size
(
w
,
h
)
};
}
marker
.
setPosition
(
position
);
marker
.
setIcon
(
icon
);
marker
.
setRotation
(
option
.
rotate
||
0
);
if
(
"
setRotation
"
in
marker
)
{
marker
.
setRotation
(
option
.
rotate
||
0
);
}
const
labelOpt
=
option
.
label
||
{};
if
(
marker
.
label
)
{
if
(
"
label
"
in
marker
)
{
marker
.
label
.
setMap
(
null
);
delete
marker
.
label
;
}
let
label
;
if
(
labelOpt
.
content
)
{
label
=
new
maps
.
Label
({
position
,
map
,
clickable
:
false
,
content
:
labelOpt
.
content
,
style
:
{
border
:
"
none
"
,
padding
:
"
8px
"
,
background
:
"
none
"
,
if
(
"
Label
"
in
maps
)
{
label
=
new
maps
.
Label
({
position
,
map
,
clickable
:
false
,
content
:
labelOpt
.
content
,
style
:
{
border
:
"
none
"
,
padding
:
"
8px
"
,
background
:
"
none
"
,
color
:
labelOpt
.
color
,
fontSize
:
(
labelOpt
.
fontSize
||
14
)
+
"
px
"
,
lineHeight
:
(
labelOpt
.
fontSize
||
14
)
+
"
px
"
,
marginLeft
:
labelOpt
.
x
,
marginTop
:
labelOpt
.
y
}
});
marker
.
label
=
label
;
}
else
if
(
"
setLabel
"
in
marker
)
{
marker
.
setLabel
({
text
:
labelOpt
.
content
,
color
:
labelOpt
.
color
,
fontSize
:
(
labelOpt
.
fontSize
||
14
)
+
"
px
"
,
lineHeight
:
(
labelOpt
.
fontSize
||
14
)
+
"
px
"
,
marginLeft
:
labelOpt
.
x
,
marginTop
:
labelOpt
.
y
}
});
marker
.
label
=
label
;
fontSize
:
(
labelOpt
.
fontSize
||
14
)
+
"
px
"
});
}
}
const
calloutOpt
=
option
.
callout
||
{};
let
callout
=
marker
.
callout
;
...
...
@@ -7860,7 +7881,10 @@ var MapMarker = /* @__PURE__ */ defineSystemComponent({
const
duration
=
data
.
duration
;
const
autoRotate
=
!!
data
.
autoRotate
;
let
rotate
=
Number
(
data
.
rotate
)
||
0
;
const
rotation
=
marker
.
getRotation
();
let
rotation
=
0
;
if
(
"
getRotation
"
in
marker
)
{
rotation
=
marker
.
getRotation
();
}
const
a
=
marker
.
getPosition
();
const
b
=
new
maps
.
LatLng
(
destination
.
latitude
,
destination
.
longitude
);
const
distance
=
maps
.
geometry
.
spherical
.
computeDistanceBetween
(
a
,
b
)
/
1
e3
;
...
...
@@ -7902,8 +7926,15 @@ var MapMarker = /* @__PURE__ */ defineSystemComponent({
}
rotate
=
maps
.
geometry
.
spherical
.
computeHeading
(
a
,
b
)
-
lastRtate
;
}
marker
.
setRotation
(
rotation
+
rotate
);
marker
.
moveTo
(
b
,
speed
);
if
(
"
setRotation
"
in
marker
)
{
marker
.
setRotation
(
rotation
+
rotate
);
}
if
(
"
moveTo
"
in
marker
)
{
marker
.
moveTo
(
b
,
speed
);
}
else
{
marker
.
setPosition
(
b
);
maps
.
event
.
trigger
(
marker
,
"
moveend
"
,
{});
}
});
}
};
...
...
@@ -8062,11 +8093,14 @@ var MapCircle = /* @__PURE__ */ defineSystemComponent({
const
center
=
new
maps
.
LatLng
(
option
.
latitude
,
option
.
longitude
);
function
getColor
(
color
)
{
const
c
=
color
.
match
(
/#
[
0-9A-Fa-f
]{6}([
0-9A-Fa-f
]{2})?
/
);
if
(
c
&&
c
.
length
)
{
return
maps
.
Color
.
fromHex
(
c
[
0
],
Number
(
"
0x
"
+
c
[
1
]
||
255
)
/
255
);
}
else
{
return
void
0
;
if
(
"
Color
"
in
maps
)
{
if
(
c
&&
c
.
length
)
{
return
maps
.
Color
.
fromHex
(
c
[
0
],
Number
(
"
0x
"
+
c
[
1
]
||
255
)
/
255
).
toRGBA
();
}
else
{
return
void
0
;
}
}
return
color
;
}
circle
=
new
maps
.
Circle
({
map
,
...
...
@@ -8250,6 +8284,20 @@ function getPoints(points) {
}
return
newPoints
;
}
function
getLat
(
latLng
)
{
if
(
"
getLat
"
in
latLng
)
{
return
latLng
.
getLat
();
}
else
{
return
latLng
.
lat
();
}
}
function
getLng
(
latLng
)
{
if
(
"
getLng
"
in
latLng
)
{
return
latLng
.
getLng
();
}
else
{
return
latLng
.
lng
();
}
}
function
useMap
(
props2
,
rootRef
,
emit2
)
{
const
mapRef
=
vue
.
ref
(
null
);
let
maps
;
...
...
@@ -8303,8 +8351,8 @@ function useMap(props2, rootRef, emit2) {
onMapReady
(()
=>
{
const
center
=
map
.
getCenter
();
uniShared
.
callOptions
(
data
,
{
latitude
:
center
.
getLat
(
),
longitude
:
center
.
getLng
(
),
latitude
:
getLat
(
center
),
longitude
:
getLng
(
center
),
errMsg
:
`
${
type
}
:ok`
});
});
...
...
@@ -8363,12 +8411,12 @@ function useMap(props2, rootRef, emit2) {
const
northeast
=
latLngBounds
.
getNorthEast
();
uniShared
.
callOptions
(
data
,
{
southwest
:
{
latitude
:
southwest
.
getLat
(
),
longitude
:
southwest
.
getLng
(
)
latitude
:
getLat
(
southwest
),
longitude
:
getLng
(
southwest
)
},
northeast
:
{
latitude
:
northeast
.
getLat
(
),
longitude
:
northeast
.
getLng
(
)
latitude
:
getLat
(
northeast
),
longitude
:
getLng
(
northeast
)
},
errMsg
:
`
${
type
}
:ok`
});
...
...
packages/uni-h5/dist/uni-h5.es.js
浏览文件 @
37390661
...
...
@@ -588,14 +588,14 @@ function attrChange(attr2) {
style[attr3] = elementComputedStyle[attr3];
});
changeAttrs.length = 0;
callbacks
$1
.forEach(function(callback) {
callbacks.forEach(function(callback) {
callback(style);
});
}, 0);
}
changeAttrs.push(attr2);
}
var callbacks
$1
= [];
var callbacks = [];
function onChange(callback) {
if (!getSupport()) {
return;
...
...
@@ -604,13 +604,13 @@ function onChange(callback) {
init();
}
if (typeof callback === "function") {
callbacks
$1
.push(callback);
callbacks.push(callback);
}
}
function offChange(callback) {
var index2 = callbacks
$1
.indexOf(callback);
var index2 = callbacks.indexOf(callback);
if (index2 >= 0) {
callbacks
$1
.splice(index2, 1);
callbacks.splice(index2, 1);
}
}
var safeAreaInsets = {
...
...
@@ -14741,7 +14741,18 @@ function useWebViewSize(rootRef, iframeRef) {
return _resize;
}
function createCallout(maps2) {
const overlay = new maps2.Overlay();
const overlay = new (maps2.OverlayView || maps2.Overlay)();
function onAdd() {
const div = this.div;
const panes = this.getPanes();
panes.floatPane.appendChild(div);
}
function onRemove() {
const parentNode = this.div.parentNode;
if (parentNode) {
parentNode.removeChild(this.div);
}
}
class Callout {
constructor(option = {}) {
this.setMap = overlay.setMap;
...
...
@@ -14751,13 +14762,18 @@ function createCallout(maps2) {
this.map_changed = overlay.map_changed;
this.set = overlay.set;
this.get = overlay.get;
this.setOptions = overlay.set
Option
s;
this.setOptions = overlay.set
Value
s;
this.bindTo = overlay.bindTo;
this.bindsTo = overlay.bindsTo;
this.notify = overlay.notify;
this.setValues = overlay.setValues;
this.unbind = overlay.unbind;
this.unbindAll = overlay.unbindAll;
this.addListener = overlay.addListener;
this.onAdd = onAdd;
this.construct = onAdd;
this.onRemove = onRemove;
this.destroy = onRemove;
this.option = option || {};
const map = option.map;
this.position = option.position;
...
...
@@ -14785,11 +14801,6 @@ function createCallout(maps2) {
get onclick() {
return this.div.onclick;
}
construct() {
const div = this.div;
const panes = this.getPanes();
panes.floatPane.appendChild(div);
}
setOption(option) {
this.option = option;
this.setPosition(option.position);
...
...
@@ -14831,39 +14842,56 @@ function createCallout(maps2) {
const divStyle = this.div.style;
divStyle.display = this.visible ? "block" : "none";
}
destroy() {
const parentNode = this.div.parentNode;
if (parentNode) {
parentNode.removeChild(this.div);
}
}
}
return Callout;
}
var MapType;
(function(MapType2) {
MapType2["QQ"] = "qq";
MapType2["GOOGLE"] = "google";
})(MapType || (MapType = {}));
let maps;
const callbacks
= []
;
const
QQ_MAP_CALLBACKNAME = "__qq
_map_callback__";
const callbacks
Map = {}
;
const
GOOGLE_MAP_CALLBACKNAME = "_
_map_callback__";
function loadMaps(callback) {
let type;
let key;
if (__uniConfig.qqMapKey) {
type = MapType.QQ;
key = __uniConfig.qqMapKey;
} else if (__uniConfig.googleMapKey) {
type = MapType.GOOGLE;
key = __uniConfig.googleMapKey;
} else {
console.error("Map key not configured.");
return;
}
const callbacks2 = callbacksMap[type] = callbacksMap[type] || [];
if (maps) {
callback(maps);
} else if (window.qq && window.qq.maps) {
maps = window.qq.maps;
} else if (window[type] && window[type].maps) {
maps = window[type].maps;
maps.Callout = maps.Callout || createCallout(maps);
callback(maps);
} else if (callbacks.length) {
callbacks.push(callback);
} else if (callbacks
2
.length) {
callbacks
2
.push(callback);
} else {
callbacks.push(callback);
const key = __uniConfig.qqMapKey;
callbacks2.push(callback);
const globalExt = window;
globalExt[QQ_MAP_CALLBACKNAME] = function() {
delete globalExt[QQ_MAP_CALLBACKNAME];
maps = window.qq.maps;
const callbackName = GOOGLE_MAP_CALLBACKNAME + type;
globalExt[callbackName] = function() {
delete globalExt[callbackName];
maps = window[type].maps;
maps.Callout = createCallout(maps);
callbacks.forEach((callback2) => callback2(maps));
callbacks.length = 0;
callbacks
2
.forEach((callback2) => callback2(maps));
callbacks
2
.length = 0;
};
const script = document.createElement("script");
script.src = `https://map.qq.com/api/js?v=2.exp&key=${key}&callback=${QQ_MAP_CALLBACKNAME}&libraries=geometry`;
const src = type === MapType.GOOGLE ? "https://maps.googleapis.com/maps/api/js?" : "https://map.qq.com/api/js?v=2.exp&libraries=geometry&";
script.src = `${src}key=${key}&callback=${callbackName}`;
script.onerror = function() {
console.error("Map load failed.");
};
document.body.appendChild(script);
}
}
...
...
@@ -14958,8 +14986,8 @@ var MapMarker = /* @__PURE__ */ defineSystemComponent({
let w;
let h;
let top;
let x =
anchor.x
;
let y =
anchor.y
;
let x =
typeof anchor.x === "number" ? anchor.x : 0.5
;
let y =
typeof anchor.y === "number" ? anchor.y : 1
;
if (option.iconPath && (option.width || option.height)) {
w = option.width || img.width / img.height * option.height;
h = option.height || img.height / img.width * option.width;
...
...
@@ -14967,37 +14995,53 @@ var MapMarker = /* @__PURE__ */ defineSystemComponent({
w = img.width / 2;
h = img.height / 2;
}
x = (typeof x === "number" ? x : 0.5) * w;
y = (typeof y === "number" ? y : 1) * h;
top = h - (h - y);
icon = new maps2.MarkerImage(img.src, null, null, new maps2.Point(x, y), new maps2.Size(w, h));
if ("MarkerImage" in maps2) {
icon = new maps2.MarkerImage(img.src, null, null, new maps2.Point(x * w, y * h), new maps2.Size(w, h));
} else {
icon = {
url: img.src,
anchor: new maps2.Point(x, y),
size: new maps2.Size(w, h)
};
}
marker.setPosition(position);
marker.setIcon(icon);
marker.setRotation(option.rotate || 0);
if ("setRotation" in marker) {
marker.setRotation(option.rotate || 0);
}
const labelOpt = option.label || {};
if (
marker.label
) {
if (
"label" in marker
) {
marker.label.setMap(null);
delete marker.label;
}
let label;
if (labelOpt.content) {
label = new maps2.Label({
position,
map,
clickable: false,
content: labelOpt.content,
style: {
border: "none",
padding: "8px",
background: "none",
if ("Label" in maps2) {
label = new maps2.Label({
position,
map,
clickable: false,
content: labelOpt.content,
style: {
border: "none",
padding: "8px",
background: "none",
color: labelOpt.color,
fontSize: (labelOpt.fontSize || 14) + "px",
lineHeight: (labelOpt.fontSize || 14) + "px",
marginLeft: labelOpt.x,
marginTop: labelOpt.y
}
});
marker.label = label;
} else if ("setLabel" in marker) {
marker.setLabel({
text: labelOpt.content,
color: labelOpt.color,
fontSize: (labelOpt.fontSize || 14) + "px",
lineHeight: (labelOpt.fontSize || 14) + "px",
marginLeft: labelOpt.x,
marginTop: labelOpt.y
}
});
marker.label = label;
fontSize: (labelOpt.fontSize || 14) + "px"
});
}
}
const calloutOpt = option.callout || {};
let callout = marker.callout;
...
...
@@ -15086,7 +15130,10 @@ var MapMarker = /* @__PURE__ */ defineSystemComponent({
const duration = data.duration;
const autoRotate = !!data.autoRotate;
let rotate = Number(data.rotate) || 0;
const rotation = marker.getRotation();
let rotation = 0;
if ("getRotation" in marker) {
rotation = marker.getRotation();
}
const a2 = marker.getPosition();
const b = new maps2.LatLng(destination.latitude, destination.longitude);
const distance2 = maps2.geometry.spherical.computeDistanceBetween(a2, b) / 1e3;
...
...
@@ -15128,8 +15175,15 @@ var MapMarker = /* @__PURE__ */ defineSystemComponent({
}
rotate = maps2.geometry.spherical.computeHeading(a2, b) - lastRtate;
}
marker.setRotation(rotation + rotate);
marker.moveTo(b, speed);
if ("setRotation" in marker) {
marker.setRotation(rotation + rotate);
}
if ("moveTo" in marker) {
marker.moveTo(b, speed);
} else {
marker.setPosition(b);
maps2.event.trigger(marker, "moveend", {});
}
});
}
};
...
...
@@ -15291,11 +15345,14 @@ var MapCircle = /* @__PURE__ */ defineSystemComponent({
const center = new maps2.LatLng(option.latitude, option.longitude);
function getColor(color) {
const c = color.match(/#[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?/);
if (c && c.length) {
return maps2.Color.fromHex(c[0], Number("0x" + c[1] || 255) / 255);
} else {
return void 0;
if ("Color" in maps2) {
if (c && c.length) {
return maps2.Color.fromHex(c[0], Number("0x" + c[1] || 255) / 255).toRGBA();
} else {
return void 0;
}
}
return color;
}
circle = new maps2.Circle({
map,
...
...
@@ -19356,6 +19413,20 @@ function getPoints(points) {
}
return newPoints;
}
function getLat(latLng) {
if ("getLat" in latLng) {
return latLng.getLat();
} else {
return latLng.lat();
}
}
function getLng(latLng) {
if ("getLng" in latLng) {
return latLng.getLng();
} else {
return latLng.lng();
}
}
function useMap(props2, rootRef, emit2) {
const trigger = useCustomEvent(rootRef, emit2);
const mapRef = ref(null);
...
...
@@ -19425,8 +19496,8 @@ function useMap(props2, rootRef, emit2) {
return {
scale: map.getZoom(),
centerLocation: {
latitude:
center.getLat(
),
longitude:
center.getLng(
)
latitude:
getLat(center
),
longitude:
getLng(center
)
}
};
}
...
...
@@ -19455,6 +19526,9 @@ function useMap(props2, rootRef, emit2) {
zoomControl: false,
scaleControl: false,
panControl: false,
fullscreenControl: false,
streetViewControl: false,
keyboardShortcuts: false,
minZoom: 5,
maxZoom: 18,
draggable: true
...
...
@@ -19496,8 +19570,8 @@ function useMap(props2, rootRef, emit2) {
});
maps2.event.addListener(map2, "center_changed", () => {
const center2 = map2.getCenter();
const latitude =
center2.getLat(
);
const longitude =
center2.getLng(
);
const latitude =
getLat(center2
);
const longitude =
getLng(center2
);
emit2("update:latitude", latitude);
emit2("update:longitude", longitude);
});
...
...
@@ -19511,8 +19585,8 @@ function useMap(props2, rootRef, emit2) {
onMapReady(() => {
const center = map.getCenter();
callOptions(data, {
latitude:
center.getLat(
),
longitude:
center.getLng(
),
latitude:
getLat(center
),
longitude:
getLng(center
),
errMsg: `${type}:ok`
});
});
...
...
@@ -19573,12 +19647,12 @@ function useMap(props2, rootRef, emit2) {
const northeast = latLngBounds.getNorthEast();
callOptions(data, {
southwest: {
latitude:
southwest.getLat(
),
longitude:
southwest.getLng(
)
latitude:
getLat(southwest
),
longitude:
getLng(southwest
)
},
northeast: {
latitude:
northeast.getLat(
),
longitude:
northeast.getLng(
)
latitude:
getLat(northeast
),
longitude:
getLng(northeast
)
},
errMsg: `${type}:ok`
});
...
...
packages/uni-h5/package.json
浏览文件 @
37390661
...
...
@@ -27,5 +27,8 @@
"safe-area-insets"
:
"^1.4.1"
,
"xmlhttprequest"
:
"^1.8.0"
},
"gitHead"
:
"453a3e6ead807864087692f4339ea3d667045fe7"
"gitHead"
:
"453a3e6ead807864087692f4339ea3d667045fe7"
,
"devDependencies"
:
{
"@types/google.maps"
:
"^3.45.6"
}
}
packages/uni-h5/src/view/components/map/MapCircle.tsx
浏览文件 @
37390661
import
{
inject
,
onUnmounted
,
watch
}
from
'
vue
'
import
{
defineSystemComponent
,
useCustomEvent
}
from
'
@dcloudio/uni-components
'
import
{
Map
,
Circle
}
from
'
./qqMap/types
'
import
{
QQMapsExt
}
from
'
./qqMap
'
import
{
Maps
,
Map
,
Circle
}
from
'
./maps
'
const
props
=
{
latitude
:
{
type
:
[
Number
,
String
],
require
:
true
},
...
...
@@ -17,7 +16,7 @@ export type Props = Partial<Record<keyof typeof props, any>>
type
CustomEventTrigger
=
ReturnType
<
typeof
useCustomEvent
>
type
OnMapReadyCallback
=
(
map
:
Map
,
maps
:
QQMapsExt
,
maps
:
Maps
,
trigger
:
CustomEventTrigger
)
=>
void
type
OnMapReady
=
(
callback
:
OnMapReadyCallback
)
=>
void
...
...
@@ -42,15 +41,21 @@ export default /*#__PURE__*/ defineSystemComponent({
const
center
=
new
maps
.
LatLng
(
option
.
latitude
,
option
.
longitude
)
function
getColor
(
color
:
string
)
{
const
c
=
color
.
match
(
/#
[
0-9A-Fa-f
]{6}([
0-9A-Fa-f
]{2})?
/
)
if
(
c
&&
c
.
length
)
{
return
maps
.
Color
.
fromHex
(
c
[
0
],
Number
(
'
0x
'
+
c
[
1
]
||
255
)
/
255
)
}
else
{
return
undefined
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
,
center
,
map
:
map
as
any
,
center
:
center
as
any
,
clickable
:
false
,
radius
:
option
.
radius
,
strokeWeight
:
Number
(
option
.
strokeWidth
)
||
1
,
...
...
packages/uni-h5/src/view/components/map/MapControl.tsx
浏览文件 @
37390661
import
{
inject
,
onUnmounted
,
watch
,
PropType
}
from
'
vue
'
import
{
getRealPath
}
from
'
@dcloudio/uni-platform
'
import
{
defineSystemComponent
,
useCustomEvent
}
from
'
@dcloudio/uni-components
'
import
{
Map
}
from
'
./qqMap/types
'
import
{
QQMapsExt
}
from
'
./qqMap
'
import
{
Maps
,
Map
}
from
'
./maps
'
interface
Position
{
left
:
number
|
string
...
...
@@ -22,7 +21,7 @@ export type Props = Partial<Record<keyof typeof props, any>>
type
CustomEventTrigger
=
ReturnType
<
typeof
useCustomEvent
>
type
OnMapReadyCallback
=
(
map
:
Map
,
maps
:
QQMapsExt
,
maps
:
Maps
,
trigger
:
CustomEventTrigger
)
=>
void
type
OnMapReady
=
(
callback
:
OnMapReadyCallback
)
=>
void
...
...
packages/uni-h5/src/view/components/map/MapLocation.tsx
浏览文件 @
37390661
...
...
@@ -7,14 +7,13 @@ import {
getLocation
,
}
from
'
../../../service/api
'
//#endif
import
{
Map
}
from
'
./qqMap/types
'
import
{
QQMapsExt
}
from
'
./qqMap
'
import
{
Maps
,
Map
}
from
'
./maps
'
import
MapMarker
from
'
./MapMarker
'
type
CustomEventTrigger
=
ReturnType
<
typeof
useCustomEvent
>
type
OnMapReadyCallback
=
(
map
:
Map
,
maps
:
QQMapsExt
,
maps
:
Maps
,
trigger
:
CustomEventTrigger
)
=>
void
type
OnMapReady
=
(
callback
:
OnMapReadyCallback
)
=>
void
...
...
packages/uni-h5/src/view/components/map/MapMarker.tsx
浏览文件 @
37390661
import
{
onUnmounted
,
inject
,
watch
}
from
'
vue
'
import
{
getRealPath
}
from
'
@dcloudio/uni-platform
'
import
{
defineSystemComponent
,
useCustomEvent
}
from
'
@dcloudio/uni-components
'
import
{
Map
,
Marker
,
Label
,
LatLng
}
from
'
./qqMap/types
'
import
{
Callout
,
CalloutOptions
,
QQMapsExt
}
from
'
./qqMap
'
import
{
Maps
,
Map
,
LatLng
,
Callout
,
CalloutOptions
}
from
'
./maps
'
import
{
Map
as
GMap
,
LatLng
as
GLatLng
,
Marker
as
GMarker
,
Label
as
GLabel
,
Icon
,
}
from
'
./maps/google/types
'
import
{
Map
as
QMap
,
LatLng
as
QLatLng
,
Marker
as
QMarker
,
Label
as
QLabel
,
MarkerImage
,
}
from
'
./maps/qq/types
'
const
props
=
{
id
:
{
...
...
@@ -74,7 +87,7 @@ export type Props = Partial<Record<keyof typeof props, any>>
type
CustomEventTrigger
=
ReturnType
<
typeof
useCustomEvent
>
type
OnMapReadyCallback
=
(
map
:
Map
,
maps
:
QQMapsExt
,
maps
:
Maps
,
trigger
:
CustomEventTrigger
)
=>
void
type
OnMapReady
=
(
callback
:
OnMapReadyCallback
)
=>
void
...
...
@@ -92,11 +105,15 @@ export interface Context {
type
AddMapChidlContext
=
(
context
:
Context
)
=>
void
type
RemoveMapChidlContext
=
(
context
:
Context
)
=>
void
interface
MarkerExt
extends
Marker
{
type
Label
=
GLabel
|
QLabel
interface
MarkerExt
{
callout
?:
InstanceType
<
Callout
>
label
?:
Label
lastPosition
?:
LatLng
}
interface
GMarkerExt
extends
GMarker
,
MarkerExt
{}
interface
QMarkerExt
extends
QMarker
,
MarkerExt
{}
type
Marker
=
GMarkerExt
|
QMarkerExt
export
default
/*#__PURE__*/
defineSystemComponent
({
name
:
'
MapMarker
'
,
...
...
@@ -104,11 +121,11 @@ export default /*#__PURE__*/ defineSystemComponent({
setup
(
props
)
{
const
id
=
String
(
Number
(
props
.
id
)
!==
NaN
?
props
.
id
:
''
)
const
onMapReady
:
OnMapReady
=
inject
(
'
onMapReady
'
)
as
OnMapReady
let
marker
:
Marker
Ext
let
marker
:
Marker
function
removeMarker
()
{
if
(
marker
)
{
if
(
marker
.
label
)
{
marker
.
label
.
setMap
(
null
)
;(
marker
.
label
as
QLabel
)
.
setMap
(
null
)
}
if
(
marker
.
callout
)
{
marker
.
callout
.
setMap
(
null
)
...
...
@@ -123,12 +140,12 @@ export default /*#__PURE__*/ defineSystemComponent({
const
img
=
new
Image
()
img
.
onload
=
()
=>
{
const
anchor
=
option
.
anchor
||
{}
let
icon
let
icon
:
MarkerImage
|
Icon
let
w
let
h
let
top
let
x
=
anchor
.
x
let
y
=
anchor
.
y
let
x
=
typeof
anchor
.
x
===
'
number
'
?
anchor
.
x
:
0.5
let
y
=
typeof
anchor
.
y
===
'
number
'
?
anchor
.
y
:
1
if
(
option
.
iconPath
&&
(
option
.
width
||
option
.
height
))
{
w
=
option
.
width
||
(
img
.
width
/
img
.
height
)
*
option
.
height
h
=
option
.
height
||
(
img
.
height
/
img
.
width
)
*
option
.
width
...
...
@@ -136,43 +153,59 @@ export default /*#__PURE__*/ defineSystemComponent({
w
=
img
.
width
/
2
h
=
img
.
height
/
2
}
x
=
(
typeof
x
===
'
number
'
?
x
:
0.5
)
*
w
y
=
(
typeof
y
===
'
number
'
?
y
:
1
)
*
h
top
=
h
-
(
h
-
y
)
icon
=
new
maps
.
MarkerImage
(
img
.
src
,
null
,
null
,
new
maps
.
Point
(
x
,
y
),
new
maps
.
Size
(
w
,
h
)
)
marker
.
setPosition
(
position
)
marker
.
setIcon
(
icon
)
marker
.
setRotation
(
option
.
rotate
||
0
)
if
(
'
MarkerImage
'
in
maps
)
{
icon
=
new
maps
.
MarkerImage
(
img
.
src
,
null
,
null
,
new
maps
.
Point
(
x
*
w
,
y
*
h
),
new
maps
.
Size
(
w
,
h
)
)
}
else
{
icon
=
{
url
:
img
.
src
,
anchor
:
new
maps
.
Point
(
x
,
y
),
size
:
new
maps
.
Size
(
w
,
h
),
}
}
marker
.
setPosition
(
position
as
any
)
marker
.
setIcon
(
icon
as
any
)
if
(
'
setRotation
'
in
marker
)
{
marker
.
setRotation
(
option
.
rotate
||
0
)
}
const
labelOpt
=
option
.
label
||
{}
if
(
marker
.
label
)
{
marker
.
label
.
setMap
(
null
)
if
(
'
label
'
in
marker
)
{
;(
marker
.
label
as
QLabel
)
.
setMap
(
null
)
delete
marker
.
label
}
let
label
if
(
labelOpt
.
content
)
{
label
=
new
maps
.
Label
({
position
,
map
,
clickable
:
false
,
content
:
labelOpt
.
content
,
style
:
{
border
:
'
none
'
,
padding
:
'
8px
'
,
background
:
'
none
'
,
if
(
'
Label
'
in
maps
)
{
label
=
new
maps
.
Label
({
position
:
position
as
QLatLng
,
map
:
map
as
QMap
,
clickable
:
false
,
content
:
labelOpt
.
content
,
style
:
{
border
:
'
none
'
,
padding
:
'
8px
'
,
background
:
'
none
'
,
color
:
labelOpt
.
color
,
fontSize
:
(
labelOpt
.
fontSize
||
14
)
+
'
px
'
,
lineHeight
:
(
labelOpt
.
fontSize
||
14
)
+
'
px
'
,
marginLeft
:
labelOpt
.
x
,
marginTop
:
labelOpt
.
y
,
},
})
marker
.
label
=
label
}
else
if
(
'
setLabel
'
in
marker
)
{
marker
.
setLabel
({
text
:
labelOpt
.
content
,
color
:
labelOpt
.
color
,
fontSize
:
(
labelOpt
.
fontSize
||
14
)
+
'
px
'
,
lineHeight
:
(
labelOpt
.
fontSize
||
14
)
+
'
px
'
,
marginLeft
:
labelOpt
.
x
,
marginTop
:
labelOpt
.
y
,
},
})
marker
.
label
=
label
})
}
}
const
calloutOpt
=
option
.
callout
||
{}
let
callout
=
marker
.
callout
...
...
@@ -224,7 +257,7 @@ export default /*#__PURE__*/ defineSystemComponent({
}
function
addMarker
(
props
:
Props
)
{
marker
=
new
maps
.
Marker
({
map
,
map
:
map
as
GMap
&
QMap
,
flat
:
true
,
autoRotation
:
false
,
})
...
...
@@ -267,14 +300,20 @@ export default /*#__PURE__*/ defineSystemComponent({
const
duration
=
data
.
duration
const
autoRotate
=
!!
data
.
autoRotate
let
rotate
:
number
=
Number
(
data
.
rotate
)
||
0
const
rotation
=
marker
.
getRotation
()
let
rotation
=
0
if
(
'
getRotation
'
in
marker
)
{
rotation
=
marker
.
getRotation
()
}
const
a
=
marker
.
getPosition
()
const
b
=
new
maps
.
LatLng
(
destination
.
latitude
,
destination
.
longitude
)
const
distance
=
maps
.
geometry
.
spherical
.
computeDistanceBetween
(
a
,
b
)
/
1000
maps
.
geometry
.
spherical
.
computeDistanceBetween
(
a
as
any
,
b
as
any
)
/
1000
const
time
=
(
typeof
duration
===
'
number
'
?
duration
:
1000
)
/
(
1000
*
60
*
60
)
...
...
@@ -286,7 +325,7 @@ export default /*#__PURE__*/ defineSystemComponent({
const
latLng
=
e
.
latLng
const
label
=
marker
.
label
if
(
label
)
{
label
.
setPosition
(
latLng
)
;(
label
as
QLabel
)
.
setPosition
(
latLng
)
}
const
callout
=
marker
.
callout
if
(
callout
)
{
...
...
@@ -297,11 +336,11 @@ export default /*#__PURE__*/ defineSystemComponent({
const
event
=
maps
.
event
.
addListener
(
marker
,
'
moveend
'
,
()
=>
{
event
.
remove
()
movingEvent
.
remove
()
marker
.
lastPosition
=
a
marker
.
setPosition
(
b
)
marker
.
lastPosition
=
a
!
marker
.
setPosition
(
b
as
any
)
const
label
=
marker
.
label
if
(
label
)
{
label
.
setPosition
(
b
)
;(
label
as
QLabel
).
setPosition
(
b
as
QLatLng
)
}
const
callout
=
marker
.
callout
if
(
callout
)
{
...
...
@@ -316,14 +355,23 @@ export default /*#__PURE__*/ defineSystemComponent({
if
(
autoRotate
)
{
if
(
marker
.
lastPosition
)
{
lastRtate
=
maps
.
geometry
.
spherical
.
computeHeading
(
marker
.
lastPosition
,
a
marker
.
lastPosition
as
any
,
a
as
any
)
}
rotate
=
maps
.
geometry
.
spherical
.
computeHeading
(
a
,
b
)
-
lastRtate
rotate
=
maps
.
geometry
.
spherical
.
computeHeading
(
a
as
any
,
b
as
any
)
-
lastRtate
}
if
(
'
setRotation
'
in
marker
)
{
marker
.
setRotation
(
rotation
+
rotate
)
}
if
(
'
moveTo
'
in
marker
)
{
marker
.
moveTo
(
b
as
QLatLng
,
speed
)
}
else
{
marker
.
setPosition
(
b
as
GLatLng
)
maps
.
event
.
trigger
(
marker
,
'
moveend
'
,
{})
}
marker
.
setRotation
(
rotation
+
rotate
)
marker
.
moveTo
(
b
,
speed
)
})
},
}
...
...
packages/uni-h5/src/view/components/map/MapPolyline.tsx
浏览文件 @
37390661
import
{
inject
,
PropType
,
onUnmounted
,
watch
}
from
'
vue
'
import
{
defineSystemComponent
,
useCustomEvent
}
from
'
@dcloudio/uni-components
'
import
{
Map
,
LatLng
,
Polyline
}
from
'
./qqMap/types
'
import
{
QQMapsExt
}
from
'
./qqMap
'
import
{
Maps
,
Map
,
LatLng
,
Polyline
}
from
'
./maps
'
interface
Point
{
latitude
:
number
...
...
@@ -30,7 +29,7 @@ export type Props = Partial<Record<keyof typeof props, any>>
type
CustomEventTrigger
=
ReturnType
<
typeof
useCustomEvent
>
type
OnMapReadyCallback
=
(
map
:
Map
,
maps
:
QQMapsExt
,
maps
:
Maps
,
trigger
:
CustomEventTrigger
)
=>
void
type
OnMapReady
=
(
callback
:
OnMapReadyCallback
)
=>
void
...
...
@@ -62,9 +61,9 @@ export default /*#__PURE__*/ defineSystemComponent({
})
const
strokeWeight
=
Number
(
option
.
width
)
||
1
polyline
=
new
maps
.
Polyline
({
map
,
map
:
map
as
any
,
clickable
:
false
,
path
,
path
:
path
as
any
,
strokeWeight
,
strokeColor
:
option
.
color
||
undefined
,
strokeDashStyle
:
option
.
dottedLine
?
'
dash
'
:
'
solid
'
,
...
...
@@ -72,9 +71,9 @@ export default /*#__PURE__*/ defineSystemComponent({
const
borderWidth
=
Number
(
option
.
borderWidth
)
||
0
if
(
borderWidth
)
{
polylineBorder
=
new
maps
.
Polyline
({
map
,
map
:
map
as
any
,
clickable
:
false
,
path
,
path
:
path
as
any
,
strokeWeight
:
strokeWeight
+
borderWidth
*
2
,
strokeColor
:
option
.
borderColor
||
undefined
,
strokeDashStyle
:
option
.
dottedLine
?
'
dash
'
:
'
solid
'
,
...
...
packages/uni-h5/src/view/components/map/index.tsx
浏览文件 @
37390661
...
...
@@ -16,8 +16,7 @@ import {
useCustomEvent
,
}
from
'
@dcloudio/uni-components
'
import
{
callOptions
}
from
'
@dcloudio/uni-shared
'
import
{
QQMapsExt
,
loadMaps
}
from
'
./qqMap
'
import
{
Map
}
from
'
./qqMap/types
'
import
{
Maps
,
Map
,
loadMaps
,
LatLng
}
from
'
./maps
'
import
MapMarker
,
{
Props
as
MapMarkerProps
,
Context
as
MapMarkerContext
,
...
...
@@ -110,6 +109,22 @@ function getPoints(points: Point[]): Point[] {
return
newPoints
}
function
getLat
(
latLng
:
LatLng
)
{
if
(
'
getLat
'
in
latLng
)
{
return
latLng
.
getLat
()
}
else
{
return
latLng
.
lat
()
}
}
function
getLng
(
latLng
:
LatLng
)
{
if
(
'
getLng
'
in
latLng
)
{
return
latLng
.
getLng
()
}
else
{
return
latLng
.
lng
()
}
}
function
useMap
(
props
:
Props
,
rootRef
:
Ref
<
HTMLElement
|
null
>
,
...
...
@@ -117,7 +132,7 @@ function useMap(
)
{
const
trigger
=
useCustomEvent
(
rootRef
,
emit
)
const
mapRef
:
Ref
<
HTMLDivElement
|
null
>
=
ref
(
null
)
let
maps
:
QQMapsExt
let
maps
:
Maps
let
map
:
Map
const
state
:
MapState
=
reactive
({
latitude
:
Number
(
props
.
latitude
),
...
...
@@ -127,7 +142,7 @@ function useMap(
type
CustomEventTrigger
=
ReturnType
<
typeof
useCustomEvent
>
type
OnMapReadyCallback
=
(
map
:
Map
,
maps
:
QQMapsExt
,
maps
:
Maps
,
trigger
:
CustomEventTrigger
)
=>
void
const
onMapReadyCallbacks
:
OnMapReadyCallback
[]
=
[]
...
...
@@ -172,7 +187,7 @@ function useMap(
state
.
latitude
=
latitude
state
.
longitude
=
longitude
if
(
map
)
{
map
.
setCenter
(
new
maps
.
LatLng
(
latitude
,
longitude
))
map
.
setCenter
(
new
maps
.
LatLng
(
latitude
,
longitude
)
as
any
)
}
}
}
...
...
@@ -195,31 +210,31 @@ function useMap(
onBoundsReadyCallbacks
.
length
=
0
}
function
getMapInfo
()
{
const
center
=
map
.
getCenter
()
const
center
=
map
.
getCenter
()
!
return
{
scale
:
map
.
getZoom
(),
centerLocation
:
{
latitude
:
center
.
getLat
(
),
longitude
:
center
.
getLng
(
),
latitude
:
getLat
(
center
),
longitude
:
getLng
(
center
),
},
}
}
function
updateCenter
()
{
map
.
setCenter
(
new
maps
.
LatLng
(
state
.
latitude
,
state
.
longitude
))
map
.
setCenter
(
new
maps
.
LatLng
(
state
.
latitude
,
state
.
longitude
)
as
any
)
}
function
updateBounds
()
{
const
bounds
=
new
maps
.
LatLngBounds
()
state
.
includePoints
.
forEach
(({
latitude
,
longitude
})
=>
{
const
latLng
=
new
maps
.
LatLng
(
latitude
,
longitude
)
bounds
.
extend
(
latLng
)
bounds
.
extend
(
latLng
as
any
)
})
map
.
fitBounds
(
bounds
)
map
.
fitBounds
(
bounds
as
any
)
}
function
initMap
()
{
const
mapEl
=
mapRef
.
value
as
HTMLDivElement
const
center
=
new
maps
.
LatLng
(
state
.
latitude
,
state
.
longitude
)
const
map
=
new
maps
.
Map
(
mapEl
,
{
center
,
center
:
center
as
any
,
zoom
:
Number
(
props
.
scale
),
// scrollwheel: false,
disableDoubleClickZoom
:
true
,
...
...
@@ -227,6 +242,9 @@ function useMap(
zoomControl
:
false
,
scaleControl
:
false
,
panControl
:
false
,
fullscreenControl
:
false
,
streetViewControl
:
false
,
keyboardShortcuts
:
false
,
minZoom
:
5
,
maxZoom
:
18
,
draggable
:
true
,
...
...
@@ -291,9 +309,9 @@ function useMap(
)
})
maps
.
event
.
addListener
(
map
,
'
center_changed
'
,
()
=>
{
const
center
=
map
.
getCenter
()
const
latitude
=
center
.
getLat
(
)
const
longitude
=
center
.
getLng
(
)
const
center
=
map
.
getCenter
()
!
const
latitude
=
getLat
(
center
)
const
longitude
=
getLng
(
center
)
emit
(
'
update:latitude
'
,
latitude
)
emit
(
'
update:longitude
'
,
longitude
)
})
...
...
@@ -307,10 +325,10 @@ function useMap(
switch
(
type
)
{
case
'
getCenterLocation
'
:
onMapReady
(()
=>
{
const
center
=
map
.
getCenter
()
const
center
=
map
.
getCenter
()
!
callOptions
(
data
,
{
latitude
:
center
.
getLat
(
),
longitude
:
center
.
getLng
(
),
latitude
:
getLat
(
center
),
longitude
:
getLng
(
center
),
errMsg
:
`
${
type
}
:ok`
,
})
})
...
...
@@ -332,7 +350,7 @@ function useMap(
state
.
latitude
=
latitude
state
.
longitude
=
longitude
if
(
map
)
{
map
.
setCenter
(
new
maps
.
LatLng
(
latitude
,
longitude
))
map
.
setCenter
(
new
maps
.
LatLng
(
latitude
,
longitude
)
as
any
)
}
onMapReady
(()
=>
{
callOptions
(
data
,
`
${
type
}
:ok`
)
...
...
@@ -370,17 +388,17 @@ function useMap(
break
case
'
getRegion
'
:
onBoundsReady
(()
=>
{
const
latLngBounds
=
map
.
getBounds
()
const
latLngBounds
=
map
.
getBounds
()
!
const
southwest
=
latLngBounds
.
getSouthWest
()
const
northeast
=
latLngBounds
.
getNorthEast
()
callOptions
(
data
,
{
southwest
:
{
latitude
:
southwest
.
getLat
(
),
longitude
:
southwest
.
getLng
(
),
latitude
:
getLat
(
southwest
),
longitude
:
getLng
(
southwest
),
},
northeast
:
{
latitude
:
northeast
.
getLat
(
),
longitude
:
northeast
.
getLng
(
),
latitude
:
getLat
(
northeast
),
longitude
:
getLng
(
northeast
),
},
errMsg
:
`
${
type
}
:ok`
,
})
...
...
@@ -402,7 +420,7 @@ function useMap(
}
catch
(
error
)
{}
onMounted
(()
=>
{
loadMaps
((
result
)
=>
{
maps
=
result
as
QQMapsExt
maps
=
result
map
=
initMap
()
emitMapReady
()
trigger
(
'
updated
'
,
{}
as
Event
,
{})
...
...
packages/uni-h5/src/view/components/map/
qqMap
/Callout.ts
→
packages/uni-h5/src/view/components/map/
maps
/Callout.ts
浏览文件 @
37390661
import
{
LatLng
,
Overlay
,
QQMaps
}
from
'
./types
'
import
{
QQMaps
,
Overlay
,
LatLng
as
QLatLng
}
from
'
./qq/types
'
import
{
GoogleMaps
,
OverlayView
,
LatLng
as
GLatLng
}
from
'
./google/types
'
export
interface
CalloutOptions
{
map
?:
any
position
?:
LatLng
position
?:
GLatLng
|
Q
LatLng
display
?:
'
ALWAYS
'
boxShadow
?:
string
content
?:
string
...
...
@@ -14,30 +15,50 @@ export interface CalloutOptions {
top
?:
number
}
export
function
createCallout
(
maps
:
QQMaps
)
{
const
overlay
=
new
maps
.
Overlay
()
class
Callout
implements
Overlay
{
export
function
createCallout
(
maps
:
QQMaps
|
GoogleMaps
)
{
const
overlay
:
OverlayView
|
Overlay
=
new
((
maps
as
GoogleMaps
)
.
OverlayView
||
(
maps
as
QQMaps
).
Overlay
)()
function
onAdd
(
this
:
Callout
)
{
const
div
=
this
.
div
const
panes
=
this
.
getPanes
()
!
panes
.
floatPane
.
appendChild
(
div
)
}
function
onRemove
(
this
:
Callout
)
{
const
parentNode
=
this
.
div
.
parentNode
if
(
parentNode
)
{
parentNode
.
removeChild
(
this
.
div
)
}
}
class
Callout
implements
OverlayView
,
Overlay
{
option
:
CalloutOptions
position
?:
LatLng
position
?:
GLatLng
|
Q
LatLng
index
?:
number
visible
?:
boolean
alwaysVisible
?:
boolean
div
:
HTMLDivElement
triangle
:
HTMLDivElement
// @ts-ignore
setMap
=
overlay
.
setMap
// @ts-ignore
getMap
=
overlay
.
getMap
// @ts-ignore
getPanes
=
overlay
.
getPanes
// @ts-ignore
getProjection
=
overlay
.
getProjection
map_changed
=
overlay
.
map_changed
map_changed
=
(
overlay
as
any
)
.
map_changed
set
=
overlay
.
set
get
=
overlay
.
get
setOptions
=
overlay
.
set
Option
s
setOptions
=
overlay
.
set
Value
s
bindTo
=
overlay
.
bindTo
bindsTo
=
overlay
.
bindsTo
bindsTo
=
(
overlay
as
any
)
.
bindsTo
notify
=
overlay
.
notify
setValues
=
overlay
.
setValues
// @ts-ignore
unbind
=
overlay
.
unbind
// @ts-ignore
unbindAll
=
overlay
.
unbindAll
addListener
=
(
overlay
as
any
).
addListener
set
onclick
(
callback
:
any
)
{
this
.
div
.
onclick
=
callback
}
...
...
@@ -72,11 +93,8 @@ export function createCallout(maps: QQMaps) {
this
.
setMap
(
map
)
}
}
construct
()
{
const
div
=
this
.
div
const
panes
=
this
.
getPanes
()
panes
.
floatPane
.
appendChild
(
div
)
}
onAdd
=
onAdd
construct
=
onAdd
setOption
(
option
:
CalloutOptions
)
{
this
.
option
=
option
this
.
setPosition
(
option
.
position
)
...
...
@@ -102,7 +120,7 @@ export function createCallout(maps: QQMaps) {
option
.
bgColor
||
'
#fff
'
}
transparent transparent`
}
setPosition
(
position
?:
LatLng
)
{
setPosition
(
position
?:
GLatLng
|
Q
LatLng
)
{
this
.
position
=
position
this
.
draw
()
}
...
...
@@ -111,7 +129,9 @@ export function createCallout(maps: QQMaps) {
if
(
!
this
.
position
||
!
this
.
div
||
!
overlayProjection
)
{
return
}
const
pixel
=
overlayProjection
.
fromLatLngToDivPixel
(
this
.
position
)
const
pixel
=
overlayProjection
.
fromLatLngToDivPixel
(
this
.
position
as
GLatLng
&
QLatLng
)
!
const
divStyle
=
this
.
div
.
style
divStyle
.
left
=
pixel
.
x
+
'
px
'
divStyle
.
top
=
pixel
.
y
+
'
px
'
...
...
@@ -120,12 +140,8 @@ export function createCallout(maps: QQMaps) {
const
divStyle
=
this
.
div
.
style
divStyle
.
display
=
this
.
visible
?
'
block
'
:
'
none
'
}
destroy
()
{
const
parentNode
=
this
.
div
.
parentNode
if
(
parentNode
)
{
parentNode
.
removeChild
(
this
.
div
)
}
}
onRemove
=
onRemove
destroy
=
onRemove
}
return
Callout
}
packages/uni-h5/src/view/components/map/maps/google/types.d.ts
0 → 100644
浏览文件 @
37390661
/// <reference types="google.maps" />
export
type
GoogleMaps
=
typeof
google
.
maps
export
type
OverlayView
=
google
.
maps
.
OverlayView
export
type
LatLng
=
google
.
maps
.
LatLng
export
type
Polyline
=
google
.
maps
.
Polyline
export
type
Map
=
google
.
maps
.
Map
export
type
Marker
=
google
.
maps
.
Marker
export
type
Label
=
google
.
maps
.
MarkerLabel
export
type
Circle
=
google
.
maps
.
Circle
export
type
Icon
=
google
.
maps
.
Icon
packages/uni-h5/src/view/components/map/maps/index.ts
0 → 100644
浏览文件 @
37390661
export
*
from
'
./types
'
import
{
QQMaps
}
from
'
./qq/types
'
import
{
GoogleMaps
}
from
'
./google/types
'
import
{
createCallout
}
from
'
./Callout
'
export
{
CalloutOptions
}
from
'
./Callout
'
export
type
Callout
=
ReturnType
<
typeof
createCallout
>
interface
MapsWithCallout
{
Callout
:
Callout
}
interface
GoogleMapsWithCallout
extends
GoogleMaps
,
MapsWithCallout
{}
interface
QQMapsWithCallout
extends
QQMaps
,
MapsWithCallout
{}
export
type
Maps
=
GoogleMapsWithCallout
|
QQMapsWithCallout
export
enum
MapType
{
QQ
=
'
qq
'
,
GOOGLE
=
'
google
'
,
}
let
maps
:
Maps
const
callbacksMap
:
Partial
<
Record
<
MapType
,
Array
<
(
maps
:
Maps
)
=>
void
>>>
=
{}
const
GOOGLE_MAP_CALLBACKNAME
=
'
__map_callback__
'
interface
WindowExt
extends
Window
{
[
key
:
string
]:
any
}
export
function
loadMaps
(
callback
:
(
maps
:
Maps
)
=>
void
)
{
let
type
:
MapType
let
key
:
string
if
(
__uniConfig
.
qqMapKey
)
{
type
=
MapType
.
QQ
key
=
__uniConfig
.
qqMapKey
}
else
if
(
__uniConfig
.
googleMapKey
)
{
type
=
MapType
.
GOOGLE
key
=
__uniConfig
.
googleMapKey
}
else
{
console
.
error
(
'
Map key not configured.
'
)
return
}
const
callbacks
=
(
callbacksMap
[
type
]
=
callbacksMap
[
type
]
||
[])
if
(
maps
)
{
callback
(
maps
)
}
else
if
((
window
as
WindowExt
)[
type
]
&&
(
window
as
WindowExt
)[
type
].
maps
)
{
maps
=
(
window
as
WindowExt
)[
type
].
maps
maps
.
Callout
=
maps
.
Callout
||
createCallout
(
maps
)
callback
(
maps
)
}
else
if
(
callbacks
.
length
)
{
callbacks
.
push
(
callback
)
}
else
{
callbacks
.
push
(
callback
)
const
globalExt
=
window
as
WindowExt
const
callbackName
=
GOOGLE_MAP_CALLBACKNAME
+
type
globalExt
[
callbackName
]
=
function
()
{
delete
globalExt
[
callbackName
]
maps
=
(
window
as
WindowExt
)[
type
].
maps
maps
.
Callout
=
createCallout
(
maps
)
callbacks
.
forEach
((
callback
)
=>
callback
(
maps
))
callbacks
.
length
=
0
}
const
script
=
document
.
createElement
(
'
script
'
)
const
src
=
type
===
MapType
.
GOOGLE
?
'
https://maps.googleapis.com/maps/api/js?
'
:
'
https://map.qq.com/api/js?v=2.exp&libraries=geometry&
'
script
.
src
=
`
${
src
}
key=
${
key
}
&callback=
${
callbackName
}
`
script
.
onerror
=
function
()
{
console
.
error
(
'
Map load failed.
'
)
}
document
.
body
.
appendChild
(
script
)
}
}
packages/uni-h5/src/view/components/map/
qqMap
/types.d.ts
→
packages/uni-h5/src/view/components/map/
maps/qq
/types.d.ts
浏览文件 @
37390661
...
...
@@ -3,7 +3,7 @@ class Base {
set
(
key
:
string
,
val
:
any
):
void
setOptions
(
options
:
any
):
void
bindTo
(
a
,
b
,
c
,
e
)
bindsTo
(
a
,
b
,
c
,
e
)
bindsTo
?:
(
a
,
b
,
c
,
e
)
=>
void
changed
(
a
)
notify
(
a
)
setValues
(
a
)
...
...
@@ -94,7 +94,7 @@ export class Overlay extends Base {
/**
*
*/
map_changed
()
map_changed
?:
()
=>
void
}
export
class
LatLng
{
...
...
packages/uni-h5/src/view/components/map/maps/types.ts
0 → 100644
浏览文件 @
37390661
import
{
Map
as
GMap
,
LatLng
as
GLatLng
,
Polyline
as
GPolyline
,
Circle
as
GCircle
,
}
from
'
./google/types
'
import
{
Map
as
QMap
,
LatLng
as
QLatLng
,
Polyline
as
QPolyline
,
Circle
as
QCircle
,
}
from
'
./qq/types
'
export
type
Map
=
GMap
|
QMap
export
type
LatLng
=
GLatLng
|
QLatLng
export
type
Polyline
=
GPolyline
|
QPolyline
export
type
Circle
=
GCircle
|
QCircle
packages/uni-h5/src/view/components/map/qqMap/index.ts
已删除
100644 → 0
浏览文件 @
85ec55ff
import
{
QQMaps
}
from
'
./types
'
import
{
createCallout
}
from
'
./Callout
'
export
{
CalloutOptions
}
from
'
./Callout
'
export
type
Callout
=
ReturnType
<
typeof
createCallout
>
export
interface
QQMapsExt
extends
QQMaps
{
Callout
:
Callout
}
let
maps
:
QQMapsExt
const
callbacks
:
Array
<
(
maps
:
QQMaps
)
=>
void
>
=
[]
const
QQ_MAP_CALLBACKNAME
=
'
__qq_map_callback__
'
interface
WindowExt
extends
Window
{
[
key
:
string
]:
any
}
export
function
loadMaps
(
callback
:
(
maps
:
QQMaps
)
=>
void
)
{
if
(
maps
)
{
callback
(
maps
)
}
else
if
(
window
.
qq
&&
window
.
qq
.
maps
)
{
maps
=
window
.
qq
.
maps
callback
(
maps
)
}
else
if
(
callbacks
.
length
)
{
callbacks
.
push
(
callback
)
}
else
{
callbacks
.
push
(
callback
)
const
key
=
__uniConfig
.
qqMapKey
const
globalExt
=
window
as
WindowExt
globalExt
[
QQ_MAP_CALLBACKNAME
]
=
function
()
{
delete
globalExt
[
QQ_MAP_CALLBACKNAME
]
maps
=
window
.
qq
.
maps
maps
.
Callout
=
createCallout
(
maps
)
callbacks
.
forEach
((
callback
)
=>
callback
(
maps
))
callbacks
.
length
=
0
}
const
script
=
document
.
createElement
(
'
script
'
)
script
.
src
=
`https://map.qq.com/api/js?v=2.exp&key=
${
key
}
&callback=
${
QQ_MAP_CALLBACKNAME
}
&libraries=geometry`
document
.
body
.
appendChild
(
script
)
}
}
yarn.lock
浏览文件 @
37390661
...
...
@@ -2452,6 +2452,11 @@
"@types/minimatch" "*"
"@types/node" "*"
"@types/google.maps@^3.45.6":
version "3.45.6"
resolved "https://registry.yarnpkg.com/@types/google.maps/-/google.maps-3.45.6.tgz#441a7bc76424243b307596fc8d282a435a979ebd"
integrity sha512-BzGzxs8UXFxeP8uN/0nRgGbsbpYQxSCKsv/7S8OitU7wwhfFcqQSm5aAcL1nbwueMiJ/VVmIZKPq69s0kX5W+Q==
"@types/graceful-fs@^4.1.2":
version "4.1.5"
resolved "https://registry.yarnpkg.com/@types/graceful-fs/-/graceful-fs-4.1.5.tgz#21ffba0d98da4350db64891f92a9e5db3cdb4e15"
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录