feat(renderer): Incorporate visual variables into the geoview renderer

[MatthewMuehlhauserNRCan]

Description

Some ESRI feature services have visualVariables that can alter feature's symbol based on a field value. This now incorporates this type of styling.

Fixes #3233

Type of change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

How Has This Been Tested?

Host updated @ 2026-01-15 4:55 PM

Created a navigator page that pulls in a FeatureService which has a rotation applied by a visual variable. Also created a layer and manually set visual variables for color, size, and opacity to make sure they are working. Example services are hard to find, so may still require some adjustments.

Visual Variable navigator page

Checklist:

• I have build (rush build) and deploy (rush host) my PR
• I have connected the issues(s) to this PR
• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• My changes generate no new warnings
• I have created new issue(s) related to the outcome of this PR is needed
• I have made corresponding changes to the documentation
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes

---

This change is 

[jolevesq]

@jolevesq reviewed 6 files and all commit messages, and made 2 comments.
Reviewable status: all files reviewed, 5 unresolved discussions (waiting on @MatthewMuehlhauserNRCan and @StatIct).

---

packages/geoview-core/src/geo/utils/renderer/geoview-renderer.ts line 1320 at r1 (raw file):

   * @returns {number} The interpolated output value.
   */
  static interpolateValue(value: number, value1: number, value2: number, output1: number, output2: number): number {

Is does functions private to the class?
Add @StatIct for JSDOC

---

packages/geoview-core/src/geo/utils/renderer/geoview-renderer.ts line 1352 at r1 (raw file):

        const g = Math.max(0, Math.min(255, color[1]));
        const b = Math.max(0, Math.min(255, color[2]));
        // Alpha is optional, defaults to 255 (fully opaque), convert to 0-1 range

Try to add empty line before a comment line for readability. Ok not to have as first comment of a if but nice for after { between const or function call

[MatthewMuehlhauserNRCan]

@MatthewMuehlhauserNRCan made 5 comments and resolved 3 discussions.
Reviewable status: 5 of 6 files reviewed, 2 unresolved discussions (waiting on @jolevesq and @StatIct).

---

packages/geoview-core/src/geo/utils/renderer/geoview-renderer.ts line 1320 at r1 (raw file):

Previously, jolevesq (Johann Levesque) wrote…

Is does functions private to the class?
Add @StatIct for JSDOC

Done

---

packages/geoview-core/src/geo/utils/renderer/geoview-renderer.ts line 1352 at r1 (raw file):

Previously, jolevesq (Johann Levesque) wrote…

Try to add empty line before a comment line for readability. Ok not to have as first comment of a if but nice for after { between const or function call

Done

[MatthewMuehlhauserNRCan]

@MatthewMuehlhauserNRCan made 1 comment and resolved 1 discussion.
Reviewable status: 5 of 6 files reviewed, 2 unresolved discussions (waiting on @jolevesq and @StatIct).

[Alex-NRCan]

@Alex-NRCan reviewed 6 files and all commit messages.
Reviewable status: all files reviewed, 2 unresolved discussions (waiting on @jolevesq and @StatIct).

[jolevesq]

@jolevesq partially reviewed 1 file and resolved 2 discussions.
Reviewable status: complete! all files reviewed, all discussions resolved (waiting on @MatthewMuehlhauserNRCan).

[jolevesq]

@jolevesq reviewed all commit messages.
Reviewable status: complete! all files reviewed, all discussions resolved (waiting on @MatthewMuehlhauserNRCan).