remove log && increate motion
This commit is contained in:
parent
4eab292e1b
commit
77416f635a
@ -604,7 +604,7 @@ export function BlogTable() {
|
|||||||
const { active, over } = event
|
const { active, over } = event
|
||||||
if (active && over && active.id !== over.id) {
|
if (active && over && active.id !== over.id) {
|
||||||
// Handle drag end for reordering
|
// Handle drag end for reordering
|
||||||
console.log('Reordering blogs:', active.id, 'to', over.id)
|
// console.log('Reordering blogs:', active.id, 'to', over.id)
|
||||||
// You can implement actual reordering API call here
|
// You can implement actual reordering API call here
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -451,7 +451,7 @@ export function CategoryTable() {
|
|||||||
function handleDragEnd(event: DragEndEvent) {
|
function handleDragEnd(event: DragEndEvent) {
|
||||||
const { active, over } = event
|
const { active, over } = event
|
||||||
if (active && over && active.id !== over.id) {
|
if (active && over && active.id !== over.id) {
|
||||||
console.log('Reordering categories:', active.id, 'to', over.id)
|
// console.log('Reordering categories:', active.id, 'to', over.id)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -559,7 +559,7 @@ export default function Control() {
|
|||||||
<CardContent>
|
<CardContent>
|
||||||
<div className="flex flex-wrap gap-3">
|
<div className="flex flex-wrap gap-3">
|
||||||
<Button className="flex items-center gap-2" onClick={() => {
|
<Button className="flex items-center gap-2" onClick={() => {
|
||||||
console.log('Applying configuration:', config)
|
// console.log('Applying configuration:', config)
|
||||||
alert('配置应用成功!')
|
alert('配置应用成功!')
|
||||||
}}>
|
}}>
|
||||||
<Zap className="h-4 w-4" />
|
<Zap className="h-4 w-4" />
|
||||||
|
|||||||
@ -447,7 +447,7 @@ export function TagTable() {
|
|||||||
function handleDragEnd(event: DragEndEvent) {
|
function handleDragEnd(event: DragEndEvent) {
|
||||||
const { active, over } = event
|
const { active, over } = event
|
||||||
if (active && over && active.id !== over.id) {
|
if (active && over && active.id !== over.id) {
|
||||||
console.log('Reordering tags:', active.id, 'to', over.id)
|
// console.log('Reordering tags:', active.id, 'to', over.id)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -31,7 +31,7 @@ export default function Page({ params }: { params: Promise<{ slug: string }> })
|
|||||||
if (!data?.blogBySlug) return <div className="flex items-center justify-center min-h-[400px]">Blog not found</div>;
|
if (!data?.blogBySlug) return <div className="flex items-center justify-center min-h-[400px]">Blog not found</div>;
|
||||||
|
|
||||||
const content = data.blogBySlug.content;
|
const content = data.blogBySlug.content;
|
||||||
console.log('Blog content:', content);
|
// console.log('Blog content:', content);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
|
|||||||
@ -51,7 +51,7 @@ export function MapProvider({ children }: MapProviderProps) {
|
|||||||
const setMap = (map: Map, layers: any[]) => {
|
const setMap = (map: Map, layers: any[]) => {
|
||||||
// 如果已经有地图实例,先清理旧的
|
// 如果已经有地图实例,先清理旧的
|
||||||
if (mapRef.current) {
|
if (mapRef.current) {
|
||||||
console.log('Cleaning up previous map instance...');
|
// console.log('Cleaning up previous map instance...');
|
||||||
mapRef.current = null;
|
mapRef.current = null;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -122,7 +122,7 @@ export function MapProvider({ children }: MapProviderProps) {
|
|||||||
|
|
||||||
const clearMap = () => {
|
const clearMap = () => {
|
||||||
if (mapRef.current) {
|
if (mapRef.current) {
|
||||||
console.log('Clearing map instance...');
|
// console.log('Clearing map instance...');
|
||||||
mapRef.current.remove();
|
mapRef.current.remove();
|
||||||
mapRef.current = null;
|
mapRef.current = null;
|
||||||
layersRef.current = [];
|
layersRef.current = [];
|
||||||
|
|||||||
@ -13,7 +13,7 @@ export default async function Layout({ children }: { children: React.ReactNode }
|
|||||||
|
|
||||||
const isLoggedIn = (await cookies()).get('jwt')?.value
|
const isLoggedIn = (await cookies()).get('jwt')?.value
|
||||||
|
|
||||||
console.log(isLoggedIn)
|
// console.log(isLoggedIn)
|
||||||
|
|
||||||
if (!isLoggedIn) {
|
if (!isLoggedIn) {
|
||||||
redirect('/login')
|
redirect('/login')
|
||||||
|
|||||||
@ -401,9 +401,9 @@ export default function MePage() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const handleSave = () => {
|
const handleSave = () => {
|
||||||
console.log("Settings saved:", settings);
|
// console.log("Settings saved:", settings);
|
||||||
console.log("Profile saved:", profile);
|
// console.log("Profile saved:", profile);
|
||||||
console.log("Tags saved:", tags);
|
// console.log("Tags saved:", tags);
|
||||||
// TODO: 实际保存到后端
|
// TODO: 实际保存到后端
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
11
app/tl.tsx
11
app/tl.tsx
@ -26,6 +26,7 @@ import { Separator } from "@/components/ui/separator";
|
|||||||
import { useWS } from "./ws-context";
|
import { useWS } from "./ws-context";
|
||||||
import { Select, SelectContent, SelectItem, SelectTrigger } from "@/components/ui/select";
|
import { Select, SelectContent, SelectItem, SelectTrigger } from "@/components/ui/select";
|
||||||
import { useIsMobile } from "@/hooks/use-mobile";
|
import { useIsMobile } from "@/hooks/use-mobile";
|
||||||
|
import { Label } from "@/components/ui/label";
|
||||||
|
|
||||||
|
|
||||||
interface Uniforms {
|
interface Uniforms {
|
||||||
@ -154,7 +155,6 @@ export const Timeline: React.FC<Props> = React.memo(({
|
|||||||
// 合并配置
|
// 合并配置
|
||||||
const config: TimelineConfig = {
|
const config: TimelineConfig = {
|
||||||
initialCenterTime: defaultCenterTime,
|
initialCenterTime: defaultCenterTime,
|
||||||
initialTimeRange: (defaultEndTime - defaultStartTime) / 2, // 使用时间范围的一半作为初始范围
|
|
||||||
highlightWeekends: false,
|
highlightWeekends: false,
|
||||||
zoomMode: ZoomMode.MousePosition,
|
zoomMode: ZoomMode.MousePosition,
|
||||||
zoomSensitivity: 0.001,
|
zoomSensitivity: 0.001,
|
||||||
@ -174,6 +174,15 @@ export const Timeline: React.FC<Props> = React.memo(({
|
|||||||
primaryFontSize: 10,
|
primaryFontSize: 10,
|
||||||
secondaryFontSize: 10
|
secondaryFontSize: 10
|
||||||
},
|
},
|
||||||
|
discreteZoomLevels: [
|
||||||
|
604123.3009862272,
|
||||||
|
383869.5109421124,
|
||||||
|
167314.88060646105,
|
||||||
|
64314.3439546868,
|
||||||
|
24625.670894409748,
|
||||||
|
4964.7447283082365,
|
||||||
|
],
|
||||||
|
initialZoomLevel: 4964.7447283082365,
|
||||||
onDateChange: async (date: Date) => {
|
onDateChange: async (date: Date) => {
|
||||||
const datestr = formatInTimeZone(date, 'UTC', 'yyyyMMddHHmmss')
|
const datestr = formatInTimeZone(date, 'UTC', 'yyyyMMddHHmmss')
|
||||||
const url_base = process.env.NEXT_PUBLIC_GRAPHQL_BACKEND_URL?.replace('/graphql', '') || 'http://localhost:3050'
|
const url_base = process.env.NEXT_PUBLIC_GRAPHQL_BACKEND_URL?.replace('/graphql', '') || 'http://localhost:3050'
|
||||||
|
|||||||
@ -356,7 +356,7 @@ export function UserProvider({ children }: UserProviderProps) {
|
|||||||
// 监听用户数据变化,定期更新用户信息
|
// 监听用户数据变化,定期更新用户信息
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (userData && authState.isAuthenticated) {
|
if (userData && authState.isAuthenticated) {
|
||||||
console.log('userData', userData)
|
// console.log('userData', userData)
|
||||||
updateUserInfo(userData)
|
updateUserInfo(userData)
|
||||||
}
|
}
|
||||||
}, [userData, authState.isAuthenticated])
|
}, [userData, authState.isAuthenticated])
|
||||||
|
|||||||
@ -463,7 +463,7 @@ export function MapComponent({
|
|||||||
|
|
||||||
// 清理函数:当组件卸载或重新初始化时清理资源
|
// 清理函数:当组件卸载或重新初始化时清理资源
|
||||||
return () => {
|
return () => {
|
||||||
console.log('Cleaning up map resources...');
|
// console.log('Cleaning up map resources...');
|
||||||
|
|
||||||
// 清理自定义图层引用
|
// 清理自定义图层引用
|
||||||
customLayerRef.current = null;
|
customLayerRef.current = null;
|
||||||
@ -492,7 +492,7 @@ export function MapComponent({
|
|||||||
const gl = glRef.current
|
const gl = glRef.current
|
||||||
if (!gl) return;
|
if (!gl) return;
|
||||||
|
|
||||||
console.log('Updating texture with imgBitmap:', imgBitmap);
|
// console.log('Updating texture with imgBitmap:', imgBitmap);
|
||||||
|
|
||||||
gl.bindTexture(gl.TEXTURE_2D, texRef.current)
|
gl.bindTexture(gl.TEXTURE_2D, texRef.current)
|
||||||
|
|
||||||
|
|||||||
@ -39,7 +39,7 @@ export function useRadarTile({
|
|||||||
radarTileRef.current.url = url
|
radarTileRef.current.url = url
|
||||||
const blob = await resp.blob()
|
const blob = await resp.blob()
|
||||||
const newImgBitmap = await createImageBitmap(blob)
|
const newImgBitmap = await createImageBitmap(blob)
|
||||||
console.log('Created new ImageBitmap:', newImgBitmap);
|
// console.log('Created new ImageBitmap:', newImgBitmap);
|
||||||
setImgBitmap(newImgBitmap) // 使用 setState 更新状态
|
setImgBitmap(newImgBitmap) // 使用 setState 更新状态
|
||||||
}).catch((err) => {
|
}).catch((err) => {
|
||||||
radarTileRef.current.isError = true
|
radarTileRef.current.isError = true
|
||||||
|
|||||||
@ -75,6 +75,8 @@ interface TimelineConfig {
|
|||||||
initialCenterTime?: number;
|
initialCenterTime?: number;
|
||||||
/** 初始显示范围(毫秒,默认1小时) */
|
/** 初始显示范围(毫秒,默认1小时) */
|
||||||
initialTimeRange?: number;
|
initialTimeRange?: number;
|
||||||
|
/** Initial Zoom Level */
|
||||||
|
initialZoomLevel?: number | null;
|
||||||
/** 缩放模式 */
|
/** 缩放模式 */
|
||||||
zoomMode?: ZoomMode;
|
zoomMode?: ZoomMode;
|
||||||
/** 缩放灵敏度 */
|
/** 缩放灵敏度 */
|
||||||
@ -226,7 +228,7 @@ class Viewport {
|
|||||||
|
|
||||||
/** 获取缩放级别(像素/毫秒) */
|
/** 获取缩放级别(像素/毫秒) */
|
||||||
getZoomLevel(): number {
|
getZoomLevel(): number {
|
||||||
return this.width / this.timeRange;
|
return this.timeRange / this.width;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 将时间转换为屏幕坐标 */
|
/** 将时间转换为屏幕坐标 */
|
||||||
@ -291,6 +293,7 @@ class Viewport {
|
|||||||
const newTimeAtMouse = this.screenToTime(screenX);
|
const newTimeAtMouse = this.screenToTime(screenX);
|
||||||
const timeCorrection = timeAtMouse - newTimeAtMouse;
|
const timeCorrection = timeAtMouse - newTimeAtMouse;
|
||||||
this.centerTime += timeCorrection;
|
this.centerTime += timeCorrection;
|
||||||
|
console.log(this.getZoomLevel())
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 动画缩放到指定时间范围 */
|
/** 动画缩放到指定时间范围 */
|
||||||
@ -429,8 +432,8 @@ class ScaleManager {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
level: TimeFormatLevel.FiveMinutes,
|
level: TimeFormatLevel.FiveMinutes,
|
||||||
majorInterval: 5 * 60 * 1000, // 5分钟
|
majorInterval: 6 * 60 * 1000, // 5分钟
|
||||||
minorTicks: 5, // 每分钟一个次刻度
|
minorTicks: 6, // 每分钟一个次刻度
|
||||||
minPixelDistance: 60,
|
minPixelDistance: 60,
|
||||||
maxPixelDistance: 150,
|
maxPixelDistance: 150,
|
||||||
formatter: (date: Date) => ({
|
formatter: (date: Date) => ({
|
||||||
@ -440,8 +443,8 @@ class ScaleManager {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
level: TimeFormatLevel.TenMinutes,
|
level: TimeFormatLevel.TenMinutes,
|
||||||
majorInterval: 10 * 60 * 1000, // 10分钟
|
majorInterval: 12 * 60 * 1000, // 12分钟
|
||||||
minorTicks: 2, // 每5分钟一个次刻度
|
minorTicks: 2, // 每6分钟一个次刻度
|
||||||
minPixelDistance: 50,
|
minPixelDistance: 50,
|
||||||
maxPixelDistance: 120,
|
maxPixelDistance: 120,
|
||||||
formatter: (date: Date) => ({
|
formatter: (date: Date) => ({
|
||||||
@ -501,7 +504,7 @@ class ScaleManager {
|
|||||||
{
|
{
|
||||||
level: TimeFormatLevel.Day,
|
level: TimeFormatLevel.Day,
|
||||||
majorInterval: 24 * 60 * 60 * 1000, // 1天
|
majorInterval: 24 * 60 * 60 * 1000, // 1天
|
||||||
minorTicks: 4, // 每6小时一个次刻度
|
minorTicks: 12, // 每6小时一个次刻度
|
||||||
minPixelDistance: 80,
|
minPixelDistance: 80,
|
||||||
maxPixelDistance: 200,
|
maxPixelDistance: 200,
|
||||||
formatter: (date: Date) => ({
|
formatter: (date: Date) => ({
|
||||||
@ -523,7 +526,7 @@ class ScaleManager {
|
|||||||
const zoomLevel = viewport.getZoomLevel();
|
const zoomLevel = viewport.getZoomLevel();
|
||||||
|
|
||||||
for (const level of this.scaleLevels) {
|
for (const level of this.scaleLevels) {
|
||||||
const pixelDistance = level.majorInterval * zoomLevel;
|
const pixelDistance = level.majorInterval / zoomLevel;
|
||||||
if (pixelDistance >= level.minPixelDistance && pixelDistance <= level.maxPixelDistance) {
|
if (pixelDistance >= level.minPixelDistance && pixelDistance <= level.maxPixelDistance) {
|
||||||
this.currentLevel = level;
|
this.currentLevel = level;
|
||||||
return level;
|
return level;
|
||||||
@ -531,7 +534,7 @@ class ScaleManager {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 如果没有找到合适的级别,选择最接近的
|
// 如果没有找到合适的级别,选择最接近的
|
||||||
const pixelDistances = this.scaleLevels.map(level => level.majorInterval * zoomLevel);
|
const pixelDistances = this.scaleLevels.map(level => level.majorInterval / zoomLevel);
|
||||||
const targetDistance = 100; // 目标像素距离
|
const targetDistance = 100; // 目标像素距离
|
||||||
const closestIndex = pixelDistances.reduce((bestIdx, dist, idx) => {
|
const closestIndex = pixelDistances.reduce((bestIdx, dist, idx) => {
|
||||||
const bestDist = pixelDistances[bestIdx];
|
const bestDist = pixelDistances[bestIdx];
|
||||||
@ -705,14 +708,14 @@ class InteractionHandler {
|
|||||||
|
|
||||||
/** 处理离散缩放 */
|
/** 处理离散缩放 */
|
||||||
private handleDiscreteZoom(deltaY: number, mouseX: number, viewport: Viewport, markX?: number): void {
|
private handleDiscreteZoom(deltaY: number, mouseX: number, viewport: Viewport, markX?: number): void {
|
||||||
const currentRange = viewport.getTimeRange();
|
const currentLevel = viewport.getZoomLevel();
|
||||||
|
|
||||||
// 找到当前最接近的缩放级别
|
// 找到当前最接近的缩放级别
|
||||||
let currentLevelIndex = 0;
|
let currentLevelIndex = 0;
|
||||||
let minDiff = Math.abs(this.discreteZoomLevels[0] - currentRange);
|
let minDiff = Math.abs(this.discreteZoomLevels[0] - currentLevel);
|
||||||
|
|
||||||
for (let i = 1; i < this.discreteZoomLevels.length; i++) {
|
for (let i = 1; i < this.discreteZoomLevels.length; i++) {
|
||||||
const diff = Math.abs(this.discreteZoomLevels[i] - currentRange);
|
const diff = Math.abs(this.discreteZoomLevels[i] - currentLevel);
|
||||||
if (diff < minDiff) {
|
if (diff < minDiff) {
|
||||||
minDiff = diff;
|
minDiff = diff;
|
||||||
currentLevelIndex = i;
|
currentLevelIndex = i;
|
||||||
@ -721,7 +724,7 @@ class InteractionHandler {
|
|||||||
|
|
||||||
// 根据滚轮方向确定目标级别
|
// 根据滚轮方向确定目标级别
|
||||||
let targetLevelIndex: number;
|
let targetLevelIndex: number;
|
||||||
if (deltaY > 0) {
|
if (deltaY < 0) {
|
||||||
// 向上滚动,缩小(增加时间范围)
|
// 向上滚动,缩小(增加时间范围)
|
||||||
targetLevelIndex = Math.min(currentLevelIndex + 1, this.discreteZoomLevels.length - 1);
|
targetLevelIndex = Math.min(currentLevelIndex + 1, this.discreteZoomLevels.length - 1);
|
||||||
} else {
|
} else {
|
||||||
@ -734,7 +737,7 @@ class InteractionHandler {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const targetRange = this.discreteZoomLevels[targetLevelIndex];
|
const targetRange = viewport.getWidth() * this.discreteZoomLevels[targetLevelIndex];
|
||||||
const zoomX = (this.zoomMode === ZoomMode.MarkMode && markX) ? markX : mouseX;
|
const zoomX = (this.zoomMode === ZoomMode.MarkMode && markX) ? markX : mouseX;
|
||||||
|
|
||||||
if (this.enableSmoothZoom) {
|
if (this.enableSmoothZoom) {
|
||||||
@ -882,10 +885,14 @@ class RealTimeTimeline {
|
|||||||
// 初始化组件
|
// 初始化组件
|
||||||
this.viewport = new Viewport(canvas.width, canvas.height);
|
this.viewport = new Viewport(canvas.width, canvas.height);
|
||||||
this.viewport.goToTime(this.config.initialCenterTime);
|
this.viewport.goToTime(this.config.initialCenterTime);
|
||||||
if (this.config.initialTimeRange) {
|
if (this.config.initialTimeRange && !this.config.initialZoomLevel) {
|
||||||
this.viewport.setTimeRange(this.config.initialTimeRange);
|
this.viewport.setTimeRange(this.config.initialTimeRange);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (this.config.initialZoomLevel && !this.config.initialTimeRange) {
|
||||||
|
this.viewport.setTimeRange(this.viewport.getWidth() * this.config.initialZoomLevel);
|
||||||
|
}
|
||||||
|
|
||||||
this.scaleManager = new ScaleManager();
|
this.scaleManager = new ScaleManager();
|
||||||
this.interaction = new InteractionHandler(
|
this.interaction = new InteractionHandler(
|
||||||
this.config.zoomMode,
|
this.config.zoomMode,
|
||||||
@ -931,6 +938,7 @@ class RealTimeTimeline {
|
|||||||
const defaultConfig: Required<TimelineConfig> = {
|
const defaultConfig: Required<TimelineConfig> = {
|
||||||
initialCenterTime: Date.now(),
|
initialCenterTime: Date.now(),
|
||||||
initialTimeRange: 60 * 60 * 1000, // 1小时
|
initialTimeRange: 60 * 60 * 1000, // 1小时
|
||||||
|
initialZoomLevel: null,
|
||||||
zoomMode: ZoomMode.MousePosition,
|
zoomMode: ZoomMode.MousePosition,
|
||||||
zoomSensitivity: 0.001,
|
zoomSensitivity: 0.001,
|
||||||
discreteZoomLevels: defaultDiscreteZoomLevels,
|
discreteZoomLevels: defaultDiscreteZoomLevels,
|
||||||
@ -969,6 +977,7 @@ class RealTimeTimeline {
|
|||||||
return {
|
return {
|
||||||
initialCenterTime: config.initialCenterTime ?? defaultConfig.initialCenterTime,
|
initialCenterTime: config.initialCenterTime ?? defaultConfig.initialCenterTime,
|
||||||
initialTimeRange: config.initialTimeRange ?? defaultConfig.initialTimeRange,
|
initialTimeRange: config.initialTimeRange ?? defaultConfig.initialTimeRange,
|
||||||
|
initialZoomLevel: config.initialZoomLevel ?? defaultConfig.initialZoomLevel,
|
||||||
zoomMode: config.zoomMode ?? defaultConfig.zoomMode,
|
zoomMode: config.zoomMode ?? defaultConfig.zoomMode,
|
||||||
zoomSensitivity: config.zoomSensitivity ?? defaultConfig.zoomSensitivity,
|
zoomSensitivity: config.zoomSensitivity ?? defaultConfig.zoomSensitivity,
|
||||||
discreteZoomLevels: config.discreteZoomLevels ?? defaultConfig.discreteZoomLevels,
|
discreteZoomLevels: config.discreteZoomLevels ?? defaultConfig.discreteZoomLevels,
|
||||||
@ -1485,6 +1494,11 @@ class RealTimeTimeline {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
currentLevel(): number {
|
||||||
|
return this.viewport.getZoomLevel()
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/** 获取当前视口信息 */
|
/** 获取当前视口信息 */
|
||||||
getViewportInfo(): {
|
getViewportInfo(): {
|
||||||
centerTime: number;
|
centerTime: number;
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user