Merge pull request #75 from UNopenGIS/add-gsi-seamlessphoto

Add GIS SeamlessPhoto Preview
UNopenGIS · Jun 29, 2024 · f42f847 · f42f847
2 parents 45947a9 + 880eb67
commit f42f847
Show file tree

Hide file tree

Showing 16 changed files with 61 additions and 5 deletions.
diff --git a/.storybook/manager.ts b/.storybook/manager.ts
@@ -4,7 +4,7 @@ import CustomTheme from "./CustomTheme.ts";
 
 addons.setConfig({
   theme: CustomTheme,
-  navSize: 300,
+  navSize: 500,
   bottomPanelHeight: 100,
   rightPanelWidth: 100,
   enableShortcuts: true,

diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -6,6 +6,7 @@
     "arcgisonline",
     "BODC",
     "clearmap",
+    "cyberjapandata",
     "DAAC",
     "GEBCO",
     "geofabrik",

diff --git a/public/stylejson/cyberjapandata.gsi.go.jp/xyz/seamlessphoto/style.json b/public/stylejson/cyberjapandata.gsi.go.jp/xyz/seamlessphoto/style.json
@@ -0,0 +1,22 @@
+{
+  "version": 8,
+  "sources": {
+    "gsi_xyz_seamlessphoto": {
+      "type": "raster",
+      "tiles": [
+        "https://cyberjapandata.gsi.go.jp/xyz/seamlessphoto/{z}/{x}/{y}.png"
+      ],
+      "tileSize": 256,
+      "attribution": "<a href=\"https://maps.gsi.go.jp/development/ichiran.html\">地理院タイル</a>, データソース：Landsat8画像（GSI,TSIC,GEO Grid/AIST）, Landsat8画像（courtesy of the U.S. Geological Survey）, 海底地形（GEBCO） / Images on 世界衛星モザイク画像 obtained from site https://lpdaac.usgs.gov/data_access maintained by the NASA Land Processes Distributed Active Archive Center (LP DAAC), USGS/Earth Resources Observation and Science (EROS) Center, Sioux Falls, South Dakota, (Year). Source of image data product."
+    }
+  },
+  "layers": [
+    {
+      "id": "gsi_xyz_seamlessphoto",
+      "source": "gsi_xyz_seamlessphoto",
+      "type": "raster",
+      "maxzoom": 15,
+      "minzoom": 5
+    }
+  ]
+}
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,8 +1,8 @@
 import './App.css'
-import { ArcGISWorldImagery } from './components/SatelliteImagery/ArcGISWorldImagery'
-import { OpenStreetMapFrHotRaster } from './components/OpenStreetMap/OpenStreetMapFrHotRaster'
-import { OpenStreetMapJpOSMBrightVector } from './components/OpenStreetMap/OpenStreetMapJpOSMBrightVector'
-import { OpenStreetMapOrgRaster } from './components/OpenStreetMap/OpenStreetMapOrgRaster'
+import { ArcGISWorldImagery } from './components/BaseMaps/SatelliteImagery/ArcGISWorldImagery'
+import { OpenStreetMapFrHotRaster } from './components/BaseMaps/OpenStreetMap/OpenStreetMapFrHotRaster'
+import { OpenStreetMapJpOSMBrightVector } from './components/BaseMaps/OpenStreetMap/OpenStreetMapJpOSMBrightVector'
+import { OpenStreetMapOrgRaster } from './components/BaseMaps/OpenStreetMap/OpenStreetMapOrgRaster'
 import { UNClearMapRaster } from './components/UNClearMapRaster'
 
 function App() {

diff --git a/...OpenStreetMapFrHotRaster/index.stories.ts → ...OpenStreetMapFrHotRaster/index.stories.ts b/...OpenStreetMapFrHotRaster/index.stories.ts → ...OpenStreetMapFrHotRaster/index.stories.ts
diff --git a/...eetMap/OpenStreetMapFrHotRaster/index.tsx → ...eetMap/OpenStreetMapFrHotRaster/index.tsx b/...eetMap/OpenStreetMapFrHotRaster/index.tsx → ...eetMap/OpenStreetMapFrHotRaster/index.tsx
diff --git a/...reetMapJpOSMBrightVector/index.stories.ts → ...reetMapJpOSMBrightVector/index.stories.ts b/...reetMapJpOSMBrightVector/index.stories.ts → ...reetMapJpOSMBrightVector/index.stories.ts
diff --git a/.../OpenStreetMapJpOSMBrightVector/index.tsx → .../OpenStreetMapJpOSMBrightVector/index.tsx b/.../OpenStreetMapJpOSMBrightVector/index.tsx → .../OpenStreetMapJpOSMBrightVector/index.tsx
diff --git a/...p/OpenStreetMapOrgRaster/index.stories.ts → ...p/OpenStreetMapOrgRaster/index.stories.ts b/...p/OpenStreetMapOrgRaster/index.stories.ts → ...p/OpenStreetMapOrgRaster/index.stories.ts
diff --git a/...treetMap/OpenStreetMapOrgRaster/index.tsx → ...treetMap/OpenStreetMapOrgRaster/index.tsx b/...treetMap/OpenStreetMapOrgRaster/index.tsx → ...treetMap/OpenStreetMapOrgRaster/index.tsx
diff --git a/...agery/ArcGISWorldImagery/index.stories.ts → ...agery/ArcGISWorldImagery/index.stories.ts b/...agery/ArcGISWorldImagery/index.stories.ts → ...agery/ArcGISWorldImagery/index.stories.ts
diff --git a/...lliteImagery/ArcGISWorldImagery/index.tsx → ...lliteImagery/ArcGISWorldImagery/index.tsx b/...lliteImagery/ArcGISWorldImagery/index.tsx → ...lliteImagery/ArcGISWorldImagery/index.tsx
diff --git a/src/components/BaseMaps/SatelliteImagery/GSISeamlessPhoto/index.stories.ts b/src/components/BaseMaps/SatelliteImagery/GSISeamlessPhoto/index.stories.ts
@@ -0,0 +1,14 @@
+import { Meta, StoryObj } from "@storybook/react";
+import { GSISeamlessPhoto } from ".";
+
+const meta = {
+  component: GSISeamlessPhoto,
+  parameters: {
+    layout: "fullscreen",
+  },
+} satisfies Meta<typeof GSISeamlessPhoto>;
+
+export default meta;
+type Story = StoryObj<typeof GSISeamlessPhoto>;
+
+export const Preview: Story = {};
diff --git a/src/components/BaseMaps/SatelliteImagery/GSISeamlessPhoto/index.tsx b/src/components/BaseMaps/SatelliteImagery/GSISeamlessPhoto/index.tsx
@@ -0,0 +1,19 @@
+import { Map } from "react-map-gl/maplibre";
+import "maplibre-gl/dist/maplibre-gl.css";
+
+export const GSISeamlessPhoto = () => {
+  return (
+    <Map
+      initialViewState={{
+        longitude: 0,
+        latitude: 0,
+        zoom: 4,
+      }}
+      dragPan={false}
+      scrollZoom={false}
+      hash={false}
+      style={{ width: "100%", height: "100%" }}
+      mapStyle="stylejson/cyberjapandata.gsi.go.jp/xyz/seamlessphoto/style.json"
+    />
+  );
+};
diff --git a/...ponents/UNClearMapRaster/index.stories.ts → ...aseMaps/UNClearMapRaster/index.stories.ts b/...ponents/UNClearMapRaster/index.stories.ts → ...aseMaps/UNClearMapRaster/index.stories.ts
diff --git a/src/components/UNClearMapRaster/index.tsx → ...nents/BaseMaps/UNClearMapRaster/index.tsx b/src/components/UNClearMapRaster/index.tsx → ...nents/BaseMaps/UNClearMapRaster/index.tsx