54 lines
1.3 KiB
TypeScript
54 lines
1.3 KiB
TypeScript
import { useState, useEffect, useRef, useCallback } from 'react'
|
|
import { addDays, subDays } from 'date-fns'
|
|
|
|
interface UseRadarTileOptions {
|
|
}
|
|
|
|
interface RadarTileStatus {
|
|
needRefresh: boolean;
|
|
isLoading: boolean;
|
|
isError: boolean;
|
|
url: string | null;
|
|
}
|
|
|
|
interface RadarTile {
|
|
needRefresh: boolean;
|
|
isLoading: boolean;
|
|
isError: boolean;
|
|
url: string | null;
|
|
}
|
|
|
|
export function useRadarTile({
|
|
}: UseRadarTileOptions = {}) {
|
|
|
|
const [imgBitmap, setImgBitmap] = useState<ImageBitmap | null>(null)
|
|
|
|
const radarTileRef = useRef<RadarTile>({
|
|
needRefresh: false,
|
|
isLoading: false,
|
|
isError: false,
|
|
url: null,
|
|
})
|
|
|
|
const fetchRadarTile = async (url: string) => {
|
|
|
|
radarTileRef.current.needRefresh = true
|
|
radarTileRef.current.isError = false
|
|
|
|
fetch(url).then(async (resp) => {
|
|
radarTileRef.current.url = url
|
|
const blob = await resp.blob()
|
|
const newImgBitmap = await createImageBitmap(blob)
|
|
console.log('Created new ImageBitmap:', newImgBitmap);
|
|
setImgBitmap(newImgBitmap) // 使用 setState 更新状态
|
|
}).catch((err) => {
|
|
radarTileRef.current.isError = true
|
|
console.error(err)
|
|
})
|
|
}
|
|
|
|
return {
|
|
imgBitmap,
|
|
fetchRadarTile,
|
|
}
|
|
} |