# Change color of existing polygon on node-red-contrib-web-worldmap

**URL:** <https://discourse.nodered.org/t/change-color-of-existing-polygon-on-node-red-contrib-web-worldmap/83558>\
**Category:** General\
**Tags:** node-red-contrib-web-worldmap\
**Created:** [9 December 2023 15:58 UTC](https://discourse.nodered.org/t/change-color-of-existing-polygon-on-node-red-contrib-web-worldmap/83558 "2023-12-09T15:58:34Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![scoobie71](https://avatars.discourse-cdn.com/v4/letter/s/b5ac83/32.png) [@scoobie71](https://discourse.nodered.org/u/scoobie71)\
**Post date:** [9 December 2023 15:58 UTC](https://discourse.nodered.org/t/change-color-of-existing-polygon-on-node-red-contrib-web-worldmap/83558/1 "2023-12-09T15:58:34Z")

</div>

I have created a map with a layer and one polygon with id=1.I want to have two buttons one to chnage the color of the polygon to red and one to blue, but i don't want to remove the layer to add again with new color. Is it possible to access the polygon element to change the color?

```auto
[
    {
        "id": "67d7c975fbac3b40",
        "type": "tab",
        "label": "Flow 2",
        "disabled": false,
        "info": "",
        "env": []
    },
    {
        "id": "d4ab8d40.31c81",
        "type": "function",
        "z": "67d7c975fbac3b40",
        "name": "",
        "func": "var building={\n \"type\": \"FeatureCollection\",\n \"features\": [\n {\n \"type\": \"Feature\",\n \"properties\": {},\n \"geometry\": {\n \"coordinates\": [\n [\n [\n -8.419921058015802,\n 41.833635881442035\n],\n [\n -8.419857581949827,\n 41.83362750200473\n],\n [\n -8.419843586685602,\n 41.833684831708524\n],\n [\n -8.419906866415005,\n 41.833692809150506\n],\n [\n -8.419921058015802,\n 41.833635881442035\n]\n ]\n ],\n \"type\": \"Polygon\"\n },\n \"id\": 1\n \n }\n ]\n};\nmsg.payload=building;\n\nvar m = {overlay:msg.topic, geojson:msg.payload, fit:true};\n\nmsg.payload = {command:{map:m, lat:41.83361, lon:-8.41993,zoom:20,rotation:-80}};\n\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 560,
        "y": 300,
        "wires": [
            [
                "f64e5234.4402e"
            ]
        ]
    },
    {
        "id": "f64e5234.4402e",
        "type": "worldmap",
        "z": "67d7c975fbac3b40",
        "name": "",
        "lat": "",
        "lon": "",
        "zoom": "",
        "layer": "OSMC",
        "cluster": "",
        "maxage": "",
        "usermenu": "show",
        "layers": "show",
        "panit": "false",
        "panlock": "false",
        "zoomlock": "false",
        "hiderightclick": "false",
        "coords": "none",
        "showgrid": "false",
        "allowFileDrop": "false",
        "path": "/worldmap",
        "overlist": "DR,CO,DN",
        "maplist": "OSMG,OSMC,EsriC,EsriS",
        "mapname": "",
        "mapurl": "",
        "mapopt": "",
        "mapwms": false,
        "x": 880,
        "y": 300,
        "wires": []
    },
    {
        "id": "62ae3b3c.8de704",
        "type": "worldmap in",
        "z": "67d7c975fbac3b40",
        "name": "",
        "path": "/worldmap",
        "events": "connect",
        "x": 320,
        "y": 300,
        "wires": [
            [
                "d4ab8d40.31c81"
            ]
        ]
    },
    {
        "id": "7d93819391f856f1",
        "type": "inject",
        "z": "67d7c975fbac3b40",
        "name": "CHANGE POLYGON ID=1 TO BLUE",
        "props": [
            {
                "p": "payload"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "",
        "payloadType": "str",
        "x": 420,
        "y": 400,
        "wires": [
            []
        ]
    },
    {
        "id": "088c615d260576de",
        "type": "inject",
        "z": "67d7c975fbac3b40",
        "name": "CHANGE POLYGON ID=1 TO RED",
        "props": [
            {
                "p": "payload"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "",
        "payloadType": "str",
        "x": 420,
        "y": 460,
        "wires": [
            []
        ]
    }
]

```

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [9 December 2023 17:22 UTC](https://discourse.nodered.org/t/change-color-of-existing-polygon-on-node-red-contrib-web-worldmap/83558/2 "2023-12-09T17:22:35Z")

</div>

On phone so can’t look at code but you should just be able to rewrite the object with the new colour. As long as the name is the same it will just update.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [7 February 2024 17:22 UTC](https://discourse.nodered.org/t/change-color-of-existing-polygon-on-node-red-contrib-web-worldmap/83558/3 "2024-02-07T17:22:44Z")

</div>

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.