mirror of
https://github.com/hamster1963/nezha-dash.git
synced 2025-04-24 21:10:45 +08:00
fix(global): the map of Russia not being fully populated
This commit is contained in:
parent
7e1a818dc2
commit
62cdb7e18c
@ -44,6 +44,42 @@ export async function Global({ countries = [] }: GlobalProps) {
|
||||
);
|
||||
|
||||
if (feature) {
|
||||
if (countryCode === "RUS") {
|
||||
// 获取俄罗斯的多个边界
|
||||
const bboxList = feature.geometry.coordinates.map((polygon: any) =>
|
||||
turf.bbox({ type: "Polygon", coordinates: polygon }),
|
||||
);
|
||||
|
||||
const spacing = 20; // 单位为千米
|
||||
const options = { units: "kilometers" };
|
||||
|
||||
bboxList.forEach((bbox: any) => {
|
||||
// @ts-expect-error ignore
|
||||
const pointGrid = turf.pointGrid(bbox, spacing, options);
|
||||
|
||||
// 过滤出位于当前多边形内部的点
|
||||
const pointsWithin = turf.pointsWithinPolygon(pointGrid, feature);
|
||||
|
||||
if (pointsWithin.features.length === 0) {
|
||||
const centroid = turf.centroid(feature);
|
||||
const [lng, lat] = centroid.geometry.coordinates;
|
||||
map.addPin({
|
||||
lat,
|
||||
lng,
|
||||
svgOptions: { color: "#FF4500", radius: 0.3 },
|
||||
});
|
||||
} else {
|
||||
pointsWithin.features.forEach((point: any) => {
|
||||
const [lng, lat] = point.geometry.coordinates;
|
||||
map.addPin({
|
||||
lat,
|
||||
lng,
|
||||
svgOptions: { color: "#FF4500", radius: 0.3 },
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
// 获取国家的边界框
|
||||
const bbox = turf.bbox(feature);
|
||||
|
||||
|
37
app/(main)/ClientComponents/GlobalGen.tsx
Normal file
37
app/(main)/ClientComponents/GlobalGen.tsx
Normal file
@ -0,0 +1,37 @@
|
||||
import { devGeoString } from "@/lib/dev-geo";
|
||||
import DottedMap, { getMapJSON } from "dotted-map";
|
||||
|
||||
export default function GlobalGen() {
|
||||
const devGeoJson = JSON.parse(devGeoString);
|
||||
const geoList = devGeoJson.features
|
||||
.filter((x: any) => x.id !== "ATA") // 添加这一行来过滤掉南极洲
|
||||
.map((x: any) => {
|
||||
return x.id;
|
||||
});
|
||||
console.log(geoList);
|
||||
|
||||
const mapString = getMapJSON({
|
||||
height: 150,
|
||||
countries: geoList, // look into `countries.geo.json` to see which keys to use. You can also omit this parameter and the whole world will be used
|
||||
grid: "diagonal", // how points should be aligned
|
||||
});
|
||||
|
||||
// const finalMap = map.getSVG({
|
||||
// radius: 0.35,
|
||||
// color: "#D1D5DA",
|
||||
// shape: "circle",
|
||||
// });
|
||||
|
||||
// const mapJsonString = getMapJSON({ height: 60, grid: 'diagonal' });
|
||||
console.log(mapString);
|
||||
|
||||
return (
|
||||
// <section className="flex flex-col gap-4 mt-[3.2px]">
|
||||
// <img
|
||||
// src={`data:image/svg+xml;utf8,${encodeURIComponent(finalMap)}`}
|
||||
// alt="World Map with Highlighted Countries"
|
||||
// />
|
||||
// </section>
|
||||
null
|
||||
);
|
||||
}
|
183
lib/dev-geo.ts
Normal file
183
lib/dev-geo.ts
Normal file
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user