diff --git a/.astro/types.d.ts b/.astro/types.d.ts new file mode 100644 index 0000000..f964fe0 --- /dev/null +++ b/.astro/types.d.ts @@ -0,0 +1 @@ +/// diff --git a/docs/public/sample.geojson b/docs/public/sample.geojson new file mode 100644 index 0000000..d96c3a5 --- /dev/null +++ b/docs/public/sample.geojson @@ -0,0 +1,425 @@ +{ + "type": "FeatureCollection", + "features": [ + { + "type": "Feature", + "properties": { + "name": "Surrounding Zigzag LineString" + }, + "geometry": { + "type": "LineString", + "coordinates": [ + [ + -65, + 15 + ], + [ + -60, + 10 + ], + [ + -55, + 15 + ], + [ + -50, + 10 + ], + [ + -45, + 15 + ], + [ + -40, + 10 + ], + [ + -35, + 15 + ], + [ + -30, + 10 + ], + [ + -25, + 15 + ], + [ + -20, + 10 + ], + [ + -15, + 15 + ], + [ + -10, + 10 + ], + [ + -10, + 5 + ], + [ + -15, + 0 + ], + [ + -20, + -5 + ], + [ + -25, + 0 + ], + [ + -30, + -5 + ], + [ + -35, + 0 + ], + [ + -40, + -5 + ], + [ + -45, + 0 + ], + [ + -50, + -5 + ], + [ + -55, + 0 + ], + [ + -60, + -5 + ], + [ + -65, + 0 + ], + [ + -65, + 15 + ] + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "GEOJSON Characters" + }, + "geometry": { + "type": "MultiPolygon", + "coordinates": [ + [ + [ + [ + -60, + 10 + ], + [ + -55, + 10 + ], + [ + -55, + 0 + ], + [ + -60, + 0 + ], + [ + -60, + 5 + ], + [ + -57, + 5 + ], + [ + -57, + 7 + ], + [ + -60, + 7 + ], + [ + -60, + 10 + ] + ] + ], + [ + [ + [ + -53, + 10 + ], + [ + -48, + 10 + ], + [ + -48, + 0 + ], + [ + -53, + 0 + ], + [ + -53, + 3 + ], + [ + -50, + 3 + ], + [ + -50, + 7 + ], + [ + -53, + 7 + ], + [ + -53, + 10 + ] + ] + ], + [ + [ + [ + -46, + 10 + ], + [ + -41, + 10 + ], + [ + -41, + 0 + ], + [ + -46, + 0 + ], + [ + -46, + 10 + ] + ], + [ + [ + -44, + 8 + ], + [ + -43, + 8 + ], + [ + -43, + 2 + ], + [ + -44, + 2 + ], + [ + -44, + 8 + ] + ] + ], + [ + [ + [ + -39, + 10 + ], + [ + -34, + 10 + ], + [ + -34, + 0 + ], + [ + -39, + 0 + ], + [ + -39, + 3 + ], + [ + -36, + 3 + ], + [ + -36, + 7 + ], + [ + -39, + 7 + ], + [ + -39, + 10 + ] + ] + ], + [ + [ + [ + -32, + 10 + ], + [ + -27, + 10 + ], + [ + -27, + 0 + ], + [ + -32, + 0 + ], + [ + -32, + 10 + ] + ], + [ + [ + -30, + 8 + ], + [ + -29, + 8 + ], + [ + -29, + 2 + ], + [ + -30, + 2 + ], + [ + -30, + 8 + ] + ] + ], + [ + [ + [ + -25, + 10 + ], + [ + -20, + 10 + ], + [ + -20, + 0 + ], + [ + -25, + 0 + ], + [ + -25, + 3 + ], + [ + -22, + 3 + ], + [ + -22, + 7 + ], + [ + -25, + 7 + ], + [ + -25, + 10 + ] + ] + ], + [ + [ + [ + -18, + 10 + ], + [ + -13, + 10 + ], + [ + -13, + 0 + ], + [ + -18, + 0 + ], + [ + -18, + 10 + ] + ], + [ + [ + -16, + 8 + ], + [ + -15, + 8 + ], + [ + -15, + 2 + ], + [ + -16, + 2 + ], + [ + -16, + 8 + ] + ] + ] + ] + } + } + ] +} \ No newline at end of file diff --git a/docs/src/examples/DataSourceExample.tsx b/docs/src/examples/DataSourceExample.tsx new file mode 100644 index 0000000..aa6dde8 --- /dev/null +++ b/docs/src/examples/DataSourceExample.tsx @@ -0,0 +1,14 @@ +import React from 'react'; +import { GeoDataSource, GeoMap } from '../../../src/lib'; + +const DataSourceExample: React.FC = () => { + return ( +
+ + + +
+ ); +}; + +export default DataSourceExample; \ No newline at end of file diff --git a/docs/src/examples/LandingPage.tsx b/docs/src/examples/DefaultMapExample.tsx similarity index 80% rename from docs/src/examples/LandingPage.tsx rename to docs/src/examples/DefaultMapExample.tsx index 4bd9620..eaa3dd7 100644 --- a/docs/src/examples/LandingPage.tsx +++ b/docs/src/examples/DefaultMapExample.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { GeoDataSource, GeoMap } from '../../../src/lib'; -const DefaultMap: React.FC = () => { +const DefaultMapExample: React.FC = () => { return (
@@ -11,4 +11,4 @@ const DefaultMap: React.FC = () => { ); }; -export default DefaultMap; \ No newline at end of file +export default DefaultMapExample; \ No newline at end of file diff --git a/docs/src/pages/index.astro b/docs/src/pages/index.astro index 7a4e799..b50987a 100644 --- a/docs/src/pages/index.astro +++ b/docs/src/pages/index.astro @@ -1,5 +1,5 @@ --- -import LandingPage from '../examples/LandingPage'; +import DefaultMapExample from '../examples/DefaultMapExample'; import Layout from '../layouts/Layout.astro'; --- @@ -31,7 +31,7 @@ function App() { } `} - +

Why Use React Reconciler?

diff --git a/docs/src/pages/test-data-source.astro b/docs/src/pages/test-data-source.astro new file mode 100644 index 0000000..cc95fa1 --- /dev/null +++ b/docs/src/pages/test-data-source.astro @@ -0,0 +1,5 @@ +--- +import DataSourceExample from "../examples/DataSourceExample"; +--- + + \ No newline at end of file diff --git a/docs/src/pages/test.astro b/docs/src/pages/test.astro index 98bcc69..0709a8f 100644 --- a/docs/src/pages/test.astro +++ b/docs/src/pages/test.astro @@ -1,5 +1,5 @@ --- -import DefaultMap from "../examples/LandingPage"; +import DefaultMapExample from "../examples/DefaultMapExample"; --- - \ No newline at end of file + \ No newline at end of file diff --git a/public/vite.svg b/public/vite.svg deleted file mode 100644 index e7b8dfb..0000000 --- a/public/vite.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/lib/render.ts b/src/lib/render.ts index b3e128a..40dafac 100644 --- a/src/lib/render.ts +++ b/src/lib/render.ts @@ -58,17 +58,20 @@ function appendChildToContainer(container: OlMap, child: OlInstance) { const applyStyles = () => { const computedStyle = getComputedStyle(targetElement); layer.setStyle({ - "fill-color": computedStyle.getPropertyValue( - "--data-source-polygon-fill-color", - ), - "stroke-color": computedStyle.getPropertyValue( - "--data-source-polygon-stroke-color", - ), - "stroke-width": Number.parseFloat( + "fill-color": computedStyle.getPropertyValue( - "--data-source-polygon-stroke-width", - ), - ), + "--data-source-polygon-fill-color", + ) || "rgba(126, 188, 111, 0.1)", + "stroke-color": + computedStyle.getPropertyValue( + "--data-source-polygon-stroke-color", + ) || "rgba(91, 124, 186, 1)", + "stroke-width": + Number.parseFloat( + computedStyle.getPropertyValue( + "--data-source-polygon-stroke-width", + ), + ) || 2, }); };