I have two datasets, one with polygons and names and one with data.

I load the map in the LHS of the screen and use the refine-on-click feature within <ods-map-layer to load a HTML table on the RHS of the screen.

However, I’d like to be able to have the map show the selection.

I’ve tried using highlight-on-refine="true" but I suspect this doesn’t work because the data on the map is not actually being refreshed!

Here is my code:!--scriptorendfragment-->

<div class="row ods-box">
    <ods-dataset-context context="dfesmap,dfesdata"
                         dfesmap-dataset="dfes-primary-polygons"
                         dfesdata-dataset="dfes-2023-primary-data0">
        <div class="col-md-8">
            <ods-map style="height:560px" scroll-wheel-zoom="true">
                <ods-map-layer context="dfesmap"
                               display="choropleth"
                               refine-on-click-context="dfesdata"
                               refine-on-click-dfesdata-map-field="pry_number_alias"
                               refine-on-click-dfesdata-context-field="group_number"
                               refine-on-click-dfesdata-replace-refine="true"
                               highlight-on-refine="true"
                               color="#3D3D3D">
                </ods-map-layer>
            </ods-map>
        </div>

<div class="col-md-4">
    <p>Current filter: {{ dfesdata.parametersm'refine.group_number'] }}</p>

    <div ng-if="!dfesdata.parametersm'refine.group_number']">
        <h3>Select an area on the map</h3>
    </div>

    <div ng-if="dfesdata.parametersm'refine.group_number']">
        <span class="ods-button" ng-click="dfesdata.parameters = {};">
            Clear filter
        </span>
        <h3>Filtered by: {{ dfesdata.parametersm'refine.group_number'] }}</h3>
        <h2>Area Data</h2>

        <table class="styled-table">
            <thead>
                <tr>
                    <th>Year</th>
                    <th>Scenario</th>
                    <th>Max Demand (MVA)</th>
                </tr>
            </thead>
            <tbody ods-results="items" ods-results-context="dfesdata">
                <tr ng-repeat="item in items">
                    <td>{{ item.fields.year }}</td>
                    <td>{{ item.fields.scenario }}</td>
                    <td>{{ item.fields.primary_substation_maximum_demand_mva }}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>


    </ods-dataset-context>
</div>