openlayers-style-editor 0.1.9 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,5 +1,5 @@
1
1
  <p align="center"><img src="https://land-it.github.io/openlayers-style-editor/favicons/android-chrome-192x192.png"></p>
2
- <h1 align="center">Welcome to <code>openlayers-style-editor</code></h1>
2
+ <h1 align="center">Welcome to OpenLayers Style Editor</h1>
3
3
 
4
4
  ![](https://img.shields.io/npm/v/openlayers-style-editor.svg)
5
5
  ![](https://img.shields.io/npm/dw/openlayers-style-editor)
@@ -46,7 +46,7 @@ This Style Editor for OpenLayers allows the user to change the style of layers.
46
46
 
47
47
  - **Unique Symbol:** Allows the user to change the layer's color, opacity, and stroke.
48
48
  - **Categorized:** Allows the user to change the layer's color, opacity, and stroke based on the values of an attribute.
49
- - **Graduated:** Allows the user to change the layer's color, opacity, and stroke based on a numeric attribute and the
49
+ - **Quantitative:** Allows the user to change the layer's color, opacity, and stroke based on a numeric attribute and the
50
50
  mode used to group its values. This package has six modes implemented, some of them are implemented using the
51
51
  [GeoBuckets](https://www.npmjs.com/package/geobuckets) package. The implemented modes are:
52
52
  - Manual
@@ -58,6 +58,8 @@ This Style Editor for OpenLayers allows the user to change the style of layers.
58
58
 
59
59
  A detailed explanation of each mode can be found [here](https://resources.arcgis.com/en/help/main/10.2/index.html#//00s50000001r000000).
60
60
 
61
+ - **Based on Rules:** Allows the user to change the layer's color, opacity, and stroke based on rules defined by the user. Each rule is composed by a name, a filter, and a renderer. The filter is a logical expression that defines which features will be styled with the renderer of the rule.
62
+
61
63
  ## Installation
62
64
 
63
65
  Depending on the installed package provider, this package can be installed with one of the following commands.
@@ -134,8 +136,7 @@ const [renderer, setRenderer] = useState<Render>(defaultRender);
134
136
 
135
137
  ## TODOs
136
138
 
137
- - [ ] Add the condition style type
138
- - [ ] Add a license
139
+ - [ ] Add more types of renderers, such as heatmap and icon renderers.
139
140
 
140
141
  ## Show your support
141
142
 
@@ -0,0 +1,18 @@
1
+ import { Render, SEAttribute } from '../rendererUtils';
2
+ import { Feature } from 'ol';
3
+ export interface FilterRule {
4
+ name: string;
5
+ filterJson?: string;
6
+ isElse: boolean;
7
+ symbol: Render;
8
+ isAll?: boolean;
9
+ }
10
+ interface Props {
11
+ setVisible: (e: boolean) => void;
12
+ features: Feature[];
13
+ applyRenderer: (renderer: Render) => void;
14
+ layerCurrentRenderer: Render;
15
+ attributes: SEAttribute[];
16
+ }
17
+ export declare function BasedOnRules(props: Props): import("react/jsx-runtime").JSX.Element;
18
+ export {};
@@ -0,0 +1,7 @@
1
+ interface Props {
2
+ parentID: number;
3
+ id: number;
4
+ deleteF: (id: number) => void;
5
+ }
6
+ export declare const ConditionOnFilter: (props: Props) => import("react/jsx-runtime").JSX.Element;
7
+ export {};
@@ -0,0 +1,5 @@
1
+ interface Props {
2
+ id: number;
3
+ }
4
+ export declare const ExpressionOnFilter: (props: Props) => import("react/jsx-runtime").JSX.Element;
5
+ export {};
@@ -0,0 +1,11 @@
1
+ import { Dispatch, SetStateAction } from 'react';
2
+ import { FilterRule } from '../basedOnRules.tsx';
3
+ interface Props {
4
+ visible: boolean;
5
+ setVisible: Dispatch<SetStateAction<boolean>>;
6
+ filter: FilterRule | undefined;
7
+ setFilter: (filter: FilterRule) => void;
8
+ canBeElse: boolean;
9
+ }
10
+ export declare const FilterWidget: (props: Props) => import("react/jsx-runtime").JSX.Element | null;
11
+ export {};
@@ -0,0 +1,46 @@
1
+ import { ReactNode } from 'react';
2
+ import { SEAttribute } from '../../rendererUtils.ts';
3
+ interface FilterWidgetI {
4
+ title: string;
5
+ expressionSet: {
6
+ id: number;
7
+ conditions: number[];
8
+ expression: {
9
+ conditions: {
10
+ op: string;
11
+ attribute: string;
12
+ value: string;
13
+ }[];
14
+ isAll: boolean | undefined;
15
+ };
16
+ }[];
17
+ expressionsComponents: number[];
18
+ attributes: SEAttribute[];
19
+ }
20
+ export type FilterWidgetContextType = {
21
+ queryWidget: FilterWidgetI;
22
+ setTitle: (value: string) => void;
23
+ setExpressionSet: (value: {
24
+ id: number;
25
+ conditions: number[];
26
+ expression: {
27
+ conditions: {
28
+ op: string;
29
+ attribute: string;
30
+ value: string;
31
+ }[];
32
+ isAll: boolean | undefined;
33
+ };
34
+ }[]) => void;
35
+ setExpressionsComponents: (value: number[]) => void;
36
+ setAttributes: (value: SEAttribute[]) => void;
37
+ reset: () => void;
38
+ addAttributes: (atts: SEAttribute[]) => void;
39
+ };
40
+ export declare const FilterWidgetContext: import('react').Context<FilterWidgetContextType | null>;
41
+ interface ProviderProps {
42
+ children: ReactNode;
43
+ attributes: SEAttribute[];
44
+ }
45
+ export declare function FilterWidgetContextProvider({ children, attributes }: ProviderProps): import("react/jsx-runtime").JSX.Element;
46
+ export {};
@@ -1,6 +1,7 @@
1
1
  import { default as React, Dispatch, SetStateAction } from 'react';
2
- import { SEAttribute, PredefinedRenderer, Render } from '../rendererUtils';
2
+ import { PredefinedRenderer, Render, SEAttribute } from '../rendererUtils';
3
3
  import { ColorRamp } from './rampColors.ts';
4
+ import { Feature } from 'ol';
4
5
  interface Props {
5
6
  attributes: SEAttribute[];
6
7
  visible: boolean;
@@ -12,6 +13,7 @@ interface Props {
12
13
  moreRamps?: ColorRamp[];
13
14
  predefinedStyles: PredefinedRenderer[];
14
15
  numbersLocale: string;
16
+ features: Feature[];
15
17
  }
16
18
  export declare const GeometryEditor: React.FC<Props>;
17
19
  export {};
@@ -1,5 +1,5 @@
1
1
  import { default as React } from 'react';
2
- import { SEAttribute, Render } from '../rendererUtils';
2
+ import { Render, SEAttribute } from '../rendererUtils';
3
3
  import { ColorRamp } from './rampColors.ts';
4
4
  interface GraduatedProps {
5
5
  attr: SEAttribute[];
@@ -0,0 +1,13 @@
1
+ import { Color } from 'ol/color';
2
+ import { FlatStyle } from 'ol/style/flat';
3
+ interface Props {
4
+ currentStyle?: FlatStyle | null;
5
+ color: Color | undefined;
6
+ setColor: (e: Color) => void;
7
+ borderColor: Color | undefined;
8
+ setBorderColor: (e: Color) => void;
9
+ borderThickness: number | undefined;
10
+ setBorderThickness: (e: number) => void;
11
+ }
12
+ export declare function UniqueSymbolComponent(props: Props): import("react/jsx-runtime").JSX.Element;
13
+ export {};