haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-04-27 19:05:16 +00:00
Code Issues Releases Wiki Activity

feat: optimize code

Browse Source
This commit is contained in:
杨国璇 2025-01-09 17:42:29 +08:00
parent e63fd15785
commit ed7f501d4d
4 changed files with 24 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/metadata/views/map/index.css
View File

@ -5,6 +5,10 @@
flex-direction: column;
}
.sf-metadata-view-map #platform div:nth-child(2) div:has(.custom-avatar-overlay) {
display: block !important;
}
.sf-metadata-view-map .sf-metadata-map-container {
width: 100%;
height: 100%;

22
frontend/src/metadata/views/map/map.js
View File

@ -33,7 +33,7 @@ const Map = ({ images, onOpenCluster }) => {
const zoomControl = new ZoomControl();
const GeolocationControl = createBMapGeolocationControl(window.BMapGL, (err, point) => {
if (!err && point) {
mapRef.current.setCenter({ lng: point.lng, lat: point.lat });
mapRef.current.setCenter(point);
}
});
@ -48,7 +48,6 @@ const Map = ({ images, onOpenCluster }) => {
const imageUrl = `${mediaUrl}img/marker.png`;
const avatarMarker = customAvatarOverlay(centerPoint, appAvatarURL, imageUrl);
mapRef.current.addOverlay(avatarMarker);
setTimeout(() => mapRef.current.showOverlayContainer(), 3000);
}, []);
const getBMapType = useCallback((type) => {
@ -101,7 +100,8 @@ const Map = ({ images, onOpenCluster }) => {
const initializeCluster = useCallback(() => {
if (mapRef.current && !clusterRef.current) {
clusterRef.current = new window.BMapLib.MarkerCluster(mapRef.current, {
callback: (e, markers) => onClickMarker(e, markers)
callback: (e, markers) => onClickMarker(e, markers),
maxZoom: 21,
});
}
}, [onClickMarker]);
@ -109,21 +109,24 @@ const Map = ({ images, onOpenCluster }) => {
const renderBaiduMap = useCallback(() => {
if (!mapRef.current || !window.BMapGL.Map) return;
let { center, zoom } = loadMapState();
let userPosition = { lng: 116.40396418840683, lat: 39.915106021711345 };
// ask for user location
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition((userInfo) => {
center = { lng: userInfo.coords.longitude, lat: userInfo.coords.latitude };
const gcPosition = wgs84_to_gcj02(center.lng, center.lat);
const gcPosition = wgs84_to_gcj02(userInfo.coords.longitude, userInfo.coords.latitude);
const bdPosition = gcj02_to_bd09(gcPosition.lng, gcPosition.lat);
const { lng, lat } = bdPosition;
center = new window.BMapGL.Point(lng, lat);
userPosition = new window.BMapGL.Point(lng, lat);
center = userPosition;
window.sfMetadataContext.localStorage.setItem(STORAGE_MAP_CENTER_KEY, center);
});
}
const mapTypeValue = window.sfMetadataContext.localStorage.getItem(STORAGE_MAP_TYPE_KEY);
mapRef.current = new window.BMapGL.Map('sf-metadata-map-container', {
enableMapClick: false,
mapType: getBMapType(mapTypeValue)
minZoom: 3,
maxZoom: 21,
mapType: getBMapType(mapTypeValue),
});
if (isValidPosition(center?.lng, center?.lat)) {
@ -131,14 +134,13 @@ const Map = ({ images, onOpenCluster }) => {
}
mapRef.current.enableScrollWheelZoom(true);
addMapController();
initializeUserMarker(center);
initializeUserMarker(userPosition);
initializeCluster();
batchIndexRef.current = 0;
renderMarkersBatch();
addMapController();
}, [addMapController, initializeCluster, initializeUserMarker, renderMarkersBatch, getBMapType, loadMapState]);
useEffect(() => {

1
frontend/src/metadata/views/map/overlay/custom-avatar-overlay.js
View File

@ -13,6 +13,7 @@ const customAvatarOverlay = (point, avatarUrl, bgUrl, width = 20, height = 25) =
this._map = map;
const divBox = document.createElement('div');
const divImg = new Image();
divBox.className = 'custom-avatar-overlay';
divBox.style.position = 'absolute';
divBox.style.width = `${this._width}px`;
divBox.style.height = `${this._height}px`;

14
media/js/map/marker-clusterer.js
View File

@ -31,6 +31,7 @@ var BMapLib = window.BMapLib = BMapLib || {};
pixelSW.y += gridSize;
var newNE = map.pixelToPoint(pixelNE);
var newSW = map.pixelToPoint(pixelSW);
if (!newSW || !newNE) return null;
return new BMapGL.Bounds(newSW, newNE);
};
@ -41,7 +42,6 @@ var BMapLib = window.BMapLib = BMapLib || {};
* @return {BMapGL.Bounds} 返回不越界的视图范围
*/
var cutBoundsInRange = function (bounds) {
console.log(bounds);
var maxX = getRange(bounds.getNorthEast().lng, -180, 180);
var minX = getRange(bounds.getSouthWest().lng, -180, 180);
var maxY = getRange(bounds.getNorthEast().lat, -90, 90);
@ -124,7 +124,7 @@ var BMapLib = window.BMapLib = BMapLib || {};
var opts = options || {};
this._gridSize = opts["gridSize"] || 60;
this._maxZoom = opts["maxZoom"] || 18;
this._maxZoom = opts["maxZoom"] || 21;
this._minClusterSize = opts["minClusterSize"] || 2;
this._isAverageCenter = false;
if (opts['isAverageCenter'] != undefined) {
@ -138,9 +138,9 @@ var BMapLib = window.BMapLib = BMapLib || {};
that._redraw();
});
this._map.addEventListener("moveend",function(){
that._redraw();
});
// this._map.addEventListener("moveend",function(){
// that._redraw();
// });
var mkrs = opts["markers"];
isArray(mkrs) && this.addMarkers(mkrs);
@ -191,7 +191,7 @@ var BMapLib = window.BMapLib = BMapLib || {};
var mapBounds = this._map.getBounds();
var extendedBounds = getExtendedBounds(this._map, mapBounds, this._gridSize);
for(var i = 0, marker; marker = this._markers[i]; i++){
if(!marker.isInCluster && extendedBounds.containsPoint(marker._position) ){
if(!marker.isInCluster && extendedBounds && extendedBounds.containsPoint(marker._position) ){
this._addToClosestCluster(marker);
}
}
@ -624,7 +624,7 @@ var BMapLib = window.BMapLib = BMapLib || {};
* @return {BMapGL.Bounds} 计算出的范围。
*/
Cluster.prototype.getBounds = function() {
var bounds = new BMapGL.Bounds(this._center,this._center);
var bounds = new BMapGL.Bounds(this._center, this._center);
for (var i = 0, marker; marker = this._markers[i]; i++) {
bounds.extend(marker.getPosition());
}