Big News: Socket raises $60M Series C at a $1B valuation to secure software supply chains for AI-driven development.Announcement →
Sign In

@canmou/react-tmap-map

Package Overview
Dependencies
Maintainers
1
Versions
18
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@canmou/react-tmap-map - npm Package Compare versions

Comparing version
1.0.3
 to
1.0.4
cjs/.useMap.js.swo

Sorry, the diff of this file is not supported yet

+39
-29
cjs/useMap.js
/// <reference types="@canmou/react-tmap-types" />
import { useEffect, useState } from "react";
import { useEffect, useMemo, useState } from "react";
export const useMap = (props = {}) => {

@@ -7,31 +7,35 @@ const [zoom, setZoom] = useState(props.zoom || 15);

const [map, setMap] = useState();
// const { ...other } = props;
const { ...other } = props;
useEffect(() => {
let instance;
const center = [113.23, 23.16];
var center2 = new TMap.LatLng(center[1], center[0]);
if (container && !map && TMap) {
// const center = [113.23, 23.16];
// var center2 = new TMap.LatLng(center[1], center[0]);
if (container && !map && window.TMap) {
// instance = new TMap.Map(container, {
// zoom,//设置地图缩放级别
// center: center2,//设置地图中心点坐标
// mapStyleId: 'style1',//个性化样式
// baseMap: {
// type: "vector",
// features: ["base", "point"], // 隐藏矢量文字
// },
// minZoom: 16,
// maxZoom: 20,
// toggleAnimation: false,
// doubleClickZoom: false,
// viewMode: '2D',
// showControl: false,
// businessSelectText: '',
// // zoomControl: false,
// // mapTypeControl: false
// });
instance = new TMap.Map(container, {
zoom,
center: center2,
mapStyleId: 'style1',
baseMap: {
type: "vector",
features: ["base", "point"], // 隐藏矢量文字
},
minZoom: 16,
maxZoom: 20,
toggleAnimation: false,
doubleClickZoom: false,
viewMode: '2D',
showControl: false,
businessSelectText: '',
// zoomControl: false,
// mapTypeControl: false
...other,
});
instance.setViewMode('2D');
if (!instance.getControl(TMap.constants.DEFAULT_CONTROL_ID.ZOOM)) { // 如果map上不存在该控件则直接返回
return;
}
instance.removeControl(TMap.constants.DEFAULT_CONTROL_ID.ZOOM);
// instance.setViewMode('2D');
// if (!instance.getControl(TMap.constants.DEFAULT_CONTROL_ID.ZOOM)) { // 如果map上不存在该控件则直接返回
// return;
// }
// instance.removeControl(TMap.constants.DEFAULT_CONTROL_ID.ZOOM);
// instance.on('zoom_changed', Dobound.use(() => {

@@ -41,6 +45,6 @@ // console.log('zoom_changed');

// }));
instance.on('zoom_changed', () => {
console.log('zoom_changed');
setZoom(zoom);
});
// instance.on('zoom_changed', () => {
// console.log('zoom_changed');
// setZoom(zoom);
// });
setMap(instance);

@@ -54,2 +58,8 @@ }

}, [container]);
useMemo(() => {
if (map && typeof props.zoom === 'number' && zoom !== props.zoom && props.zoom >= 2 && props.zoom <= 20) {
setZoom(props.zoom);
map.setZoom(props.zoom);
}
}, [zoom, props.zoom]);
return {

@@ -56,0 +66,0 @@ map,

+6
-2
package.json
{
"name": "@canmou/react-tmap-map",
"version": "1.0.3",
"version": "1.0.4",
"description": "用于加载腾讯地图SDK依赖，加载完成，全局将会有**`window.TMap`**对象。",

@@ -17,3 +17,7 @@ "main": "cjs/index.js",

},
"gitHead": "4a6771722e45d1540f0c32367c8a40eb867bc43f"
"dependencies": {
"@canmou/react-tmap-types": "^1.0.4",
"@canmou/react-tmap-utils": "^1.0.4"
},
"gitHead": "1ba95f6040a81315f7cc1692bbcd046fee1eeb61"
}
+1
-16
src/index.tsx

@@ -19,17 +19,2 @@ import { forwardRef, Fragment, useEffect, useRef } from "react";

)
});
// export interface MultiMarkerProps {
// visiable: boolean;
// }
// export const MultiMarker = forwardRef<MultiMarkerProps, MultiMarkerProps>((props, ref) => {
// const { multiMarker } = useMultiMarker(props);
// return null;
// });
// export interface HeatProps {
// visiable: boolean;
// }
// export const Heat = forwardRef<HeatProps, HeatProps>((props, refs) => {
// const { heat } = useHeat(props);
// return null;
// });
});
+94
-31
src/useMap.tsx
/// <reference types="@canmou/react-tmap-types" />
import { useEffect, useState } from "react";
import { useEffect, useMemo, useState } from "react";
import { useSettingProperties, useEventProperties } from '@canmou/react-tmap-utils';
// import { Dobound } from "../../util/common";

@@ -21,32 +22,36 @@

const [map, setMap] = useState<any>();
// const { ...other } = props;
const { ...other } = props;
useEffect(() => {
let instance: any;
const center = [113.23, 23.16];
var center2 = new TMap.LatLng(center[1], center[0]);
if (container && !map && TMap) {
if (container && !map && window.TMap) {
instance = new TMap.Map(container, {
zoom,//设置地图缩放级别
center: center2,//设置地图中心点坐标
mapStyleId: 'style1',//个性化样式
baseMap: {
type: "vector",
features: ["base", "point"], // 隐藏矢量文字
},
minZoom: 16,
maxZoom: 20,
toggleAnimation: false,
doubleClickZoom: false,
viewMode: '2D',
showControl: false,
businessSelectText: '',
// zoomControl: false,
// mapTypeControl: false
});
instance.setViewMode('2D');
if (!instance.getControl(TMap.constants.DEFAULT_CONTROL_ID.ZOOM)) { // 如果map上不存在该控件则直接返回
return;
}
instance.removeControl(TMap.constants.DEFAULT_CONTROL_ID.ZOOM);
zoom,
...other,
})
// const center = [113.23, 23.16];
// var center2 = new TMap.LatLng(center[1], center[0]);
// instance = new TMap.Map(container, {
// zoom,//设置地图缩放级别
// center: center2,//设置地图中心点坐标
// mapStyleId: 'style1',//个性化样式
// baseMap: {
// type: "vector",
// features: ["base", "point"], // 隐藏矢量文字
// },
// minZoom: 16,
// maxZoom: 20,
// toggleAnimation: false,
// doubleClickZoom: false,
// viewMode: '2D',
// showControl: false,
// businessSelectText: '',
// // zoomControl: false,
// // mapTypeControl: false
// });
// instance.setViewMode('2D');
// if (!instance.getControl(TMap.constants.DEFAULT_CONTROL_ID.ZOOM)) { // 如果map上不存在该控件则直接返回
// return;
// }
// instance.removeControl(TMap.constants.DEFAULT_CONTROL_ID.ZOOM);
// instance.on('zoom_changed', Dobound.use(() => {

@@ -56,6 +61,6 @@ // console.log('zoom_changed');

// }));
instance.on('zoom_changed', () => {
console.log('zoom_changed');
setZoom(zoom);
});
// instance.on('zoom_changed', () => {
// console.log('zoom_changed');
// setZoom(zoom);
// });
setMap(instance);

@@ -70,2 +75,60 @@ }

useMemo(() => {
if (map && typeof props.zoom === 'number' && zoom !== props.zoom && props.zoom >= 2 && props.zoom <= 20) {
setZoom(props.zoom);
map.setZoom(props.zoom);
}
}, [zoom, props.zoom]);
useSettingProperties<TMap.Map, UseMap>(map!, props, [
'Zoom',
'Layers',
'Center',
'City',
'Rotation',
'Pitch',
'Scale',
'Offset',
'Draggable',
'Scrollable',
'MaxZoom',
'MinZoom',
'Pitchable',
'Rotatable',
'DoubleClickZoom',
'Boundary',
'ViewMode',
'BaseMap',
'MapStyleId',
]);
useEventProperties<TMap.Map, UseMap>(map!, props, [
'onMouseMove',
'onZoomChange',
'onMapMove',
'onMouseWheel',
'onZoomStart',
'onMouseOver',
'onMouseOut',
'onDblClick',
'onClick',
'onZoomEnd',
'onMoveEnd',
'onMouseUp',
'onMouseDown',
'onRightClick',
'onMoveStart',
'onDragStart',
'onDragging',
'onDragEnd',
'onHotspotOut',
'onHotspotOver',
'onTouchStart',
'onComplete',
'onHotspotClick',
'onTouchMove',
'onTouchEnd',
'onResize',
]);
return {

@@ -72,0 +135,0 @@ map,