xyz icon indicating copy to clipboard operation
xyz copied to clipboard

mapp.layer.styleParser() method

Open dbauszus-glx opened this issue 4 months ago • 33 comments

Theme methods require an excessive amount of object merging.

This can be significantly reduced by processing the style object and its themes when a layer is decorated.

mapp.layer.styleParser() method processes all themes on a layer and merges the default style into the category style.

Other issues such as missing style / icon definitions can be fixed within this process method.

This will also allow us to update the style object definition without breaking backwards compatibility.


  • To see the specific tasks where the Asana app for GitHub is being used, see below:
    • https://app.asana.com/0/0/1206668063789078

dbauszus-glx avatar Feb 13 '24 20:02 dbauszus-glx

A layer.styleParser method has been introduced.

The styleParser is called from the vector and mvt format methods and checks the layer.style configuration before the layer format method is called. Warnings in regards to the layer style have been removed from the decorator method and added to the styleParser method. Each theme category is parsed and the style keys are moved into a style object. Each style object is then parsed and the icon methods are moved into an icon object. Style and icon arrays are assumed to be valid and are not parsed as style arrays are not merged with the default style.

The featureFields method erroneously checks for ownProperty instead of hasOwn for the theme distribution.

The method to create feature styles has been renamed to layer.featureStyle [from layer.Style]. The featureStyle method returns a function which returns a style for each feature to the OL layer render.

A feature is processed in following order by the featureStyle method.

  1. Check whether the style is cached as Style object.
  2. Assign feature properties, ie. from a featureObject or featureLookup.
  3. Check whether a style filter is applied.
  4. Assign the geometryType. To be reviewed whether necessary.
  5. Assign theme style or default style.
  6. Assign cluster style.
  7. Assign highlight style.
  8. Assign label style.
  9. Assign selected style.

Theme styles are parsed and must be assigned without the need to clone style objects.

The utils.style method assigns a style zIndex to vector styles. This prevents the highlight style being rendered in between.

The wkt template must check for the fields length.

The addLayer method assigns a default zIndex if not specified.

dbauszus-glx avatar Mar 05 '24 09:03 dbauszus-glx

Merged main with graduate theme fix.

WKT / Geojson properties are no longer nested.

Label and cluster styles are cloned not merged.

Geometry type is no longer required.

dbauszus-glx avatar Mar 07 '24 18:03 dbauszus-glx

https://github.com/GEOLYTIX/xyz/pull/1132/commits/7dd6eb41d16b8d134f0926f467b7e95b78af7ca9

The styleParser method must check whether the default style should be an icon.

The default style icon should be merged into the cat style icon. This can only work if neither of these icons is an array.

The categorical and graduated theme methods must not attempt to merge styles. This happens in the styleParser.

dbauszus-glx avatar Mar 12 '24 13:03 dbauszus-glx

https://github.com/GEOLYTIX/xyz/pull/1132/commits/ed0f311f9fc8f1bd333f572377696cfbc1545f48

Graduated themes can be defined to check whether the field value is less than or more than the cat.value. A warning will be issued if the chk direction is not implicit. less will be assumed in that case.

dbauszus-glx avatar Mar 12 '24 16:03 dbauszus-glx

Tested selected:null style and ensured that the selected feature lookup is escaped if style.selected is undefined.

The selected style must not be merged.

dbauszus-glx avatar Mar 14 '24 17:03 dbauszus-glx

The parser will now create a theme.categories array from the theme.cat object, or theme.cat_arr before parsing the categories array categories.

The category.value is assiugned from the key if undefined.

The category.label is assigned from the category.value if unassigned.

The styleParser is now called with the entry as layer argument from the mvt_clone and vector_layer entry methods.

dbauszus-glx avatar Mar 18 '24 17:03 dbauszus-glx

Icon being either {} or [] is a bit of a pain. How about following OL feature case and introduce icon{} and icons[]. if no icon defined => get icons, if icon replaced with icons null it, if icons replaced with icon => override

cityremade avatar Mar 26 '24 17:03 cityremade

Changed chk to graduated_breaks, with greater_than and less_than as accepted values.

dbauszus-glx avatar Mar 27 '24 16:03 dbauszus-glx

I renamed the lib.utils.style.mjs file to olStyle.mjs to make it easier to identify the nature of the module. Functionality doesn't change. The method is still called mapp.utils.style. Just a change of the module file name.

dbauszus-glx avatar Mar 28 '24 14:03 dbauszus-glx

The union function (Array Union Function) on arrays is not widely supported yet, dot notation (new Set(['foo','bar',...set_2])) achieves the same thing I believe.

AlexanderGeere avatar Apr 09 '24 09:04 AlexanderGeere

Issues found today:

  1. Pushed a commit to fix one of them - in styleParser line 164 the call to styleObject was missing the second parameter of the defaultStyle, leading to an error.
  2. A default style of this configuration breaks with an error (but works on v4.8.3)
 "default": {
      "svg": "XXX"
    }
  1. A thematic of this configuration breaks with an error (but works on v4.8.3)
  "themes": {
      "XXX": {
        "type": "categorized",
        "field": "YYY",
        "cat": {
          "option": {
            "style": {
              "svg": "XXX",
              "anchor": [
                0.5,
                1
              ]
            }
          },
          "option2": {
            "style": {
              "svg": "YYYY",
              "anchor": [
                0.5,
                1
              ]
            }
          }

simon-leech avatar Apr 16 '24 10:04 simon-leech

I added a check whether the cluster icon is nonsense.

e.g.

    "cluster": {
      "type": "target",
      "icon": {
        "style": {
          "fillColor": "#E72124"
        }
      }
    },

image

dbauszus-glx avatar Apr 17 '24 16:04 dbauszus-glx

I just pushed a commit to update the evalIconObject warning to include the layer key for easier debugging. image

simon-leech avatar Apr 18 '24 08:04 simon-leech

I just pushed a commit to update mvt_clone and vector_layer to have an entry.key so when styleParser throws warnings the layer.key is provided

simon-leech avatar Apr 18 '24 08:04 simon-leech

mvt_clone and vector_layer where drawn without a zindex and hence underneath layers with an automatic assigned zIndex.

The mvt_clone will now get the layers z-index if not implict.

The vector_layer will get the zIndex equal the length of the mapview layer keys if not implicit.

The featureStyle method will null the properties of features which are not in a featureLookup array [of IDs]. Features with null properties will not be rendered.

dbauszus-glx avatar Apr 18 '24 11:04 dbauszus-glx

image

@dbauszus-glx Do we need a lot of these checks in the layer/decorate.mjs module as they seem to be done in the styleParser.mjs module

RobAndrewHurst avatar Apr 18 '24 13:04 RobAndrewHurst

@RobAndrewHurst any style checks should be in the style parser not in the layer decorator which calls the style parser.

dbauszus-glx avatar Apr 18 '24 13:04 dbauszus-glx

The styleParser iconObject should not process to create an icon object which already exists.

The default 'dot' type icon doesn't require a colour.

dbauszus-glx avatar Apr 19 '24 14:04 dbauszus-glx

Fixed issue where the clusterScale in the layer.style.cluster was overwritten. https://github.com/GEOLYTIX/xyz/pull/1132/commits/04bdf9a1ca1322446fc01decb1ef3d4b90c4274c

dbauszus-glx avatar Apr 19 '24 15:04 dbauszus-glx

This doesn't seem to be working currently -

 "Boundary Only": {
        "title": "Boundary Only",
        "type": "basic",
        "style": {
          "fillOpacity": 0.1,
          "fillColor": "#ffffff",
          "strokeColor": "#373737",
          "strokeWidth": 1
        }
      }

simon-leech avatar Apr 25 '24 14:04 simon-leech

This is also failing with this error , it looks like the style merging isn't working properly

image

  "style": {
   "default": {
            "fillOpacity": 0.5,
            "fillColor": "#253494",
            "scale": 0.75
        },
"themes": {
 "test": {
            "type": "graduated",
            "title": "TEST",
            "legend": {
              "layout": "flex",
              "alignContents": "centered",
              "horizontal": true,
              "nowrap": true
            },
            "field": "example",
            "cat_arr": [
              {
                "value": 0,
                "label": "No Demand",
                "style": {
                  "fillOpacity": 0.1,
                  "fillColor": "#ffffff"
                }
              },
              {
                "value": 1,
                "label": "0 - 100",
                "style": {
                  "fillOpacity": 0.4,
                  "fillColor": "#e41a1c"
                }
              },
              {
                "value": 100,
                "label": "100 + ",
                "style": {
                  "fillOpacity": 0.8,
                  "fillColor": "#e41a1c"
                }
              }
            ]
          }
}
}

simon-leech avatar Apr 25 '24 14:04 simon-leech

This doesn't work -

 "default": {
      "style": {
        "icon": [
          {
            "svg": "filepath"
          }
        ]
      },
      "scale": 1,
      "zoomInScale": 0.15
    }

Looks like zoomInScale doesn't work either.

Also another issue with basic theme here -

"TEST THEME": {
        "type": "basic",
        "title": "Example",
        "style": {
          "icon": [
            {
              "svg": "filepath"
            }
          ]
        }
      }

simon-leech avatar Apr 25 '24 14:04 simon-leech

Also - please can we check that the graduated_breaks value is either greater_than or less_than - and just warn if anything else.

Currently you can pass any value to remove the warning but then the thematic will output errors

simon-leech avatar Apr 26 '24 12:04 simon-leech

The basic theme logic was borked. The basic theme style should not be merged with the default style in the legend.

The legend should be created from the basic theme style alone. And there should be a basic theme mod to apply the style directly to the feature.

dbauszus-glx avatar Apr 26 '24 16:04 dbauszus-glx

The style parser warnings will now warn if a style object is defined within the default style and assigns the style object as default.

"default": {
  "style": {
    "icon": [{"svg": "https://geolytix.github.io/MapIcons/pins/mint.svg"}]
  },
  "scale": 1,
  "zoomInScale": 0.15
},

will be turned into:

"default": {
  "icon": [{"svg": "https://geolytix.github.io/MapIcons/pins/mint.svg"}]
}

dbauszus-glx avatar Apr 29 '24 10:04 dbauszus-glx

The default width and height for an icon will be assigned in the legendicon module.

dbauszus-glx avatar Apr 30 '24 08:04 dbauszus-glx

Just pushed a commit with two minor extra checks in :

  1. Add check on cluster.distance <1 if layer wkt and warn if so
  2. Added extra check on if graduated_breaks is defined but not less_than or greater_than

simon-leech avatar May 01 '24 07:05 simon-leech

'dot' will be assigned as default icon on cluster layer which do not have a default.

dbauszus-glx avatar May 01 '24 10:05 dbauszus-glx

The cluster style method must return if count is 1. For resolution type cluster vector.

dbauszus-glx avatar May 01 '24 11:05 dbauszus-glx

The maplibre format z-index assignment fails. This is for now disabled.

dbauszus-glx avatar May 01 '24 11:05 dbauszus-glx