diff --git a/README.md b/README.md index b630aad..bbd9c2d 100644 --- a/README.md +++ b/README.md @@ -84,7 +84,9 @@ sequenceDiagram - **Integration API Base URL**: Base URL of your CMS Integration API - **Integration API Key**: Authentication key for API access +- **CMS Project ID**: ID of the CMS project - **CMS Model ID**: ID of the CMS model to visualize +- **Filters**: Optional value filters to limit displayed data ### Location Data Types @@ -92,9 +94,22 @@ sequenceDiagram 2. **Longitude & Latitude Array Field**: Single field containing coordinate array 3. **GeoJSON Field**: Field containing GeoJSON geometry data +### Data Filtering + +The plugin supports filtering CMS data when using the Integration API: + +- **Filter Format**: `field===value|value2;field2===value3` +- **Multiple Values**: Use pipe `|` to separate multiple values for the same field +- **Multiple Fields**: Use semicolon `;` to separate different field filters +- **Example**: `status===published|reviewed;category===news` + +This example will show only items where: +- `status` field equals "published" OR "reviewed" +- AND `category` field equals "news" + ### Customization -- **Infobox Fields**: Comma-separated list of fields to display in markers +- **Display Fields**: Comma-separated list of fields to display in inspector block - **Marker Appearance**: JSON configuration for marker styling ## Architecture diff --git a/public/reearth.yml b/public/reearth.yml index e4409ce..63b0f8b 100644 --- a/public/reearth.yml +++ b/public/reearth.yml @@ -60,6 +60,15 @@ extensions: field: data_source_type type: string value: cms_integration_api + - id: value_filters + title: Filters + description: "Optional, specify value filters, Example: status===published|reviewed;category===news" + type: string + ui: multiline + availableIf: + field: data_source_type + type: string + value: cms_integration_api - id: visualization title: Visualization fields: diff --git a/src/extensions/visualizer/main/hooks.ts b/src/extensions/visualizer/main/hooks.ts index b84dd77..f9b6267 100644 --- a/src/extensions/visualizer/main/hooks.ts +++ b/src/extensions/visualizer/main/hooks.ts @@ -11,6 +11,7 @@ type WidgetProperty = { integration_api_key?: string; cms_project_id?: string; cms_model_id?: string; + value_filters?: string; }; appearance: { marker_appearance?: string; @@ -254,6 +255,25 @@ export default () => { ], })); + // Apply value filters if any + // Example: status===published|reviewed;category===news + if (widgetProperty.api.value_filters) { + const filters = widgetProperty.api.value_filters + .split(";") + .map((filter) => { + const [key, values] = filter.split("==="); + return { key, values: values.split("|") }; + }); + + allItems = allItems.filter((item) => + filters.every((filter) => { + const field = item.fields.find((f) => f.key === filter.key); + if (!field) return false; + return filter.values.includes(String(field.value)); + }) + ); + } + postMsg("addLayer", allItems); } catch (error) { console.error("Error fetching data:", error); diff --git a/src/extensions/visualizer/visualizer.ts b/src/extensions/visualizer/visualizer.ts index 690c9c7..e31cd52 100644 --- a/src/extensions/visualizer/visualizer.ts +++ b/src/extensions/visualizer/visualizer.ts @@ -8,7 +8,6 @@ type VisualizationConfig = { longitude_field_key?: string; longitude_latitude_array_field_key?: string; geojson_field_key?: string; - infobox_fields?: string; marker_appearance?: string; };