japan-map-selector
Version:
Interactive Japan map component for selecting prefectures and municipalities
83 lines (82 loc) • 2.54 kB
TypeScript
export interface GeoJSONFeature {
type: 'Feature';
properties: {
N03_001: string;
N03_002?: string;
N03_003?: string;
N03_004?: string;
N03_007: string;
};
geometry: {
type: 'Polygon' | 'MultiPolygon';
coordinates: number[][][] | number[][][][];
};
}
export interface GeoJSONFeatureCollection {
type: 'FeatureCollection';
features: GeoJSONFeature[];
}
export interface Prefecture {
code: string;
name: string;
bounds: [[number, number], [number, number]];
feature: GeoJSONFeature;
}
export interface Municipality {
code: string;
name: string;
prefectureCode: string;
feature: GeoJSONFeature;
}
export interface ColorTheme {
name?: string;
prefectureFill: string;
prefectureStroke: string;
prefectureHoverFill: string;
prefectureSelectedFill: string;
municipalityFill: string;
municipalityStroke: string;
municipalityHoverFill: string;
municipalitySelectedFill: string;
backgroundColor: string;
strokeWidth: number;
}
export interface JapanMapSelectorProps {
onPrefectureSelect?: (prefecture: Prefecture) => void;
onMunicipalitySelect?: (municipality: Municipality) => void;
width?: number;
height?: number;
theme?: ColorTheme | 'default' | 'dark' | 'warm' | 'cool' | 'monochrome' | 'colorful' | 'random';
prefectureColor?: string;
prefectureHoverColor?: string;
municipalityColor?: string;
municipalityHoverColor?: string;
selectedPrefectureCode?: string;
selectedMunicipalityCode?: string;
selectablePrefectures?: string[];
disabledPrefectureFill?: string;
disabledPrefectureStroke?: string;
simplificationLevel?: 'original' | 'high' | 'medium' | 'low' | 'ultra-low';
lazyLoadMunicipalities?: boolean;
preloadMunicipalitiesDelay?: number;
enableDynamicLoading?: boolean;
dynamicDataBaseUrl?: string;
onMunicipalityLoadStart?: (prefecture?: Prefecture) => void;
onMunicipalityLoadEnd?: (prefecture?: Prefecture) => void;
showAttribution?: boolean;
attributionOptions?: {
showLink?: boolean;
position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
style?: any;
};
}
export interface MapState {
selectedPrefecture: Prefecture | null;
hoveredPrefecture: Prefecture | null;
hoveredMunicipality: Municipality | null;
viewBox: string;
scale: number;
translateX: number;
translateY: number;
showTokyoIslands?: boolean;
}