|
@@ -77,13 +77,13 @@ const Map: React.FC<MapProps> = ({ type, selFloorId, render, mapList, changeMapL
|
|
|
event.stopPropagation();
|
|
|
|
|
|
var mscaleTemp: number = Number((mscale.current + 0.1).toFixed(4));
|
|
|
- //setMscale(mscaleTemp);
|
|
|
mscale.current = Math.min(mscaleTemp, maxscale);
|
|
|
- changeMap(mscale.current);
|
|
|
- var changeWidth = (mapSize.width * (mscaleTemp - 1)) / 2;
|
|
|
- var changeHeight = (mapSize.height * (mscaleTemp - 1)) / 2;
|
|
|
- // setTranslateX(translateX - changeWidth);
|
|
|
- // setTranslateY(translateY - changeHeight);
|
|
|
+
|
|
|
+ var mapWrapWidth = (mapRef.current || {}).clientWidth || 0;
|
|
|
+ var mapWrapHeight = (mapRef.current || {}).clientHeight || 0;
|
|
|
+ var moveWidth = (mapWrapWidth * (mscale.current - 1)) / 2;
|
|
|
+ var moveHeight = (mapWrapHeight * (mscale.current - 1)) / 2;
|
|
|
+ changeMap(mscale.current, moveWidth, moveHeight);
|
|
|
|
|
|
//console.log('mscale', mscaleTemp);
|
|
|
};
|
|
@@ -94,15 +94,18 @@ const Map: React.FC<MapProps> = ({ type, selFloorId, render, mapList, changeMapL
|
|
|
// if (mscale.current > minscale) {
|
|
|
var mscaleTemp = Number((mscale.current - 0.1).toFixed(4));
|
|
|
mscale.current = Math.max(mscaleTemp, minscale);
|
|
|
- changeMap(mscale.current);
|
|
|
- var changeWidth = (mapSize.width * (mscaleTemp - 1)) / 2;
|
|
|
- var changeHeight = (mapSize.height * (mscaleTemp - 1)) / 2;
|
|
|
- // setTranslateX(translateX - changeWidth);
|
|
|
- // setTranslateY(translateY - changeHeight);
|
|
|
+
|
|
|
+ var mapWrapWidth = (mapRef.current || {}).clientWidth || 0;
|
|
|
+ var mapWrapHeight = (mapRef.current || {}).clientHeight || 0;
|
|
|
+ var moveWidth = (mapWrapWidth * (mscale.current - 1)) / 2;
|
|
|
+ var moveHeight = (mapWrapHeight * (mscale.current - 1)) / 2;
|
|
|
+
|
|
|
+ changeMap(mscale.current, moveWidth, moveHeight);
|
|
|
+
|
|
|
// }
|
|
|
};
|
|
|
- function changeMap(scale) {
|
|
|
- changeMapList(scale);
|
|
|
+ function changeMap(scale, moveWidth, moveHeight) {
|
|
|
+ changeMapList(scale, moveWidth, moveHeight);
|
|
|
}
|
|
|
//const fixWidth = 1300;
|
|
|
// useEffect(() => {
|
|
@@ -134,14 +137,15 @@ const Map: React.FC<MapProps> = ({ type, selFloorId, render, mapList, changeMapL
|
|
|
top = -((filterItem[0] || {}).top || 0);
|
|
|
var mapWrapWidth = (mapRef.current || {}).clientWidth || 0;
|
|
|
var mapWrapHeight = (mapRef.current || {}).clientHeight || 0;
|
|
|
- // setTranslateX(left * mscale + mapWrapWidth / 2);
|
|
|
- // setTranslateY(top * mscale + mapWrapHeight / 2);
|
|
|
+ setTranslateX(left + mapWrapWidth / 2);
|
|
|
+ setTranslateY(top + mapWrapHeight / 2);
|
|
|
//搜索完成
|
|
|
changeSearchBuildId(''); //清空搜索记录 以防两次搜索一样的建筑的 没反应
|
|
|
changeSearchFloorId(''); //清空搜索记录 以防两次搜索一样的楼层时 没反应 要不要换位置
|
|
|
changeSearchText({}); //清空搜索记录 好进行一些操作
|
|
|
} else if (currentFloorId.current != selFloorId) {
|
|
|
//如果两次的selFloorId 不一样 才会更改地图的位置为0 0
|
|
|
+ debugger;
|
|
|
setTranslateX(0);
|
|
|
setTranslateY(0);
|
|
|
}
|
|
@@ -167,8 +171,9 @@ const Map: React.FC<MapProps> = ({ type, selFloorId, render, mapList, changeMapL
|
|
|
var mapWrapWidth = (mapRef.current || {}).clientWidth || 0;
|
|
|
var mapWrapHeight = (mapRef.current || {}).clientHeight || 0;
|
|
|
|
|
|
- // setTranslateX(left * mscale + mapWrapWidth / 2);
|
|
|
- // setTranslateY(top * mscale + mapWrapHeight / 2);
|
|
|
+ setTranslateX(left + mapWrapWidth / 2);
|
|
|
+ setTranslateY(top + mapWrapHeight / 2);
|
|
|
+
|
|
|
changeSearchBuildId(''); //清空搜索记录 以防两次搜索一样的建筑的 没反应
|
|
|
changeSearchFloorId(''); //清空搜索记录 以防两次搜索一样的楼层时 没反应 要不要换位置
|
|
|
changeSearchText({});
|
|
@@ -201,25 +206,30 @@ const Map: React.FC<MapProps> = ({ type, selFloorId, render, mapList, changeMapL
|
|
|
if (event.deltaY > 0) console.log('向内');
|
|
|
if (event.deltaY < 0) console.log('向外');
|
|
|
var base = -0.009;
|
|
|
+ // if (event.deltaY > 100 || event.deltaY < -100) {
|
|
|
+ // base = -0.0006;
|
|
|
+ // }
|
|
|
+ var mscaleTemp = mscale.current + event.deltaY * base; //缩放倍率缓存
|
|
|
+ //console.log('mscaleTemp', mscale.current, mscaleTemp);
|
|
|
+ mscale.current = Math.min(Math.max(minscale, mscaleTemp), maxscale); //缩放倍率赋值
|
|
|
+ } else {
|
|
|
+ if (event.deltaY > 0) console.log('向上');
|
|
|
+ if (event.deltaY < 0) console.log('向下');
|
|
|
+ var base = -0.009;
|
|
|
if (event.deltaY > 100 || event.deltaY < -100) {
|
|
|
base = -0.0006;
|
|
|
}
|
|
|
var mscaleTemp = mscale.current + event.deltaY * base;
|
|
|
- console.log('mscaleTemp', mscale.current, mscaleTemp);
|
|
|
+ //console.log('mscaleTemp', mscale.current, mscaleTemp);
|
|
|
mscale.current = Math.min(Math.max(minscale, mscaleTemp), maxscale);
|
|
|
- changeMap(mscale.current);
|
|
|
- } else {
|
|
|
- if (event.deltaY > 0) console.log('向上');
|
|
|
- if (event.deltaY < 0) console.log('向下');
|
|
|
- // var base = -0.009;
|
|
|
- // if (event.deltaY > 100 || event.deltaY < -100) {
|
|
|
- // base = -0.0006;
|
|
|
- // }
|
|
|
- // var mscaleTemp = mscale.current + event.deltaY * base;
|
|
|
- // console.log('mscaleTemp', mscale.current, mscaleTemp);
|
|
|
- // mscale.current = Math.min(Math.max(minscale, mscaleTemp), maxscale);
|
|
|
- // changeMap(mscale.current);
|
|
|
}
|
|
|
+
|
|
|
+ var mapWrapWidth = (mapRef.current || {}).clientWidth || 0;
|
|
|
+ var mapWrapHeight = (mapRef.current || {}).clientHeight || 0;
|
|
|
+ var moveWidth = (mapWrapWidth * (mscale.current - 1)) / 2;
|
|
|
+ var moveHeight = (mapWrapHeight * (mscale.current - 1)) / 2;
|
|
|
+
|
|
|
+ changeMap(mscale.current, moveWidth, moveHeight);
|
|
|
});
|
|
|
}, []);
|
|
|
|