# Node-red world map zoom and marking

**URL:** <https://discourse.nodered.org/t/node-red-world-map-zoom-and-marking/53745>\
**Category:** General\
**Tags:** node-red-dashboard\
**Created:** [15 November 2021 04:03 UTC](https://discourse.nodered.org/t/node-red-world-map-zoom-and-marking/53745 "2021-11-15T04:03:49Z")\
**Posts on this page:** 1\
**Showing post:** 19

<div class="post-metadata">

**Author:** ![ScheepersJohan](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/scheepersjohan/32/39556_2.png) [@ScheepersJohan](https://discourse.nodered.org/u/ScheepersJohan)\
**Post date:** [16 November 2021 07:06 UTC](https://discourse.nodered.org/t/node-red-world-map-zoom-and-marking/53745/19 "2021-11-16T07:06:54Z")

</div>

Try this.

```auto
[
    {
        "id": "0430c6938cb6f325",
        "type": "tab",
        "label": "Map",
        "disabled": false,
        "info": ""
    },
    {
        "id": "e8b38bd564251aa2",
        "type": "worldmap",
        "z": "0430c6938cb6f325",
        "name": "Malaysia",
        "lat": "4.210484",
        "lon": "101.975769",
        "zoom": "8",
        "layer": "EsriS",
        "cluster": "",
        "maxage": "",
        "usermenu": "show",
        "layers": "show",
        "panit": "false",
        "panlock": "false",
        "zoomlock": "false",
        "hiderightclick": "false",
        "coords": "deg",
        "showgrid": "true",
        "allowFileDrop": "true",
        "path": "/worldmap",
        "mapname": "",
        "mapurl": "",
        "mapopt": "",
        "mapwms": false,
        "x": 700,
        "y": 460,
        "wires": []
    },
    {
        "id": "4147960bf8bc3e20",
        "type": "function",
        "z": "0430c6938cb6f325",
        "name": "Map All",
        "func": "msg.payload = [\n { name:\"Pahang\", lat:3.763386, lon:103.220184, \"radius\":3000, icon:\"fa-exchange\" },\n { name:\"Johor\", lat:1.485368, lon:103.761818, icon:\"fa-plus-square\" },\n { name:\"Melaka\", lat:2.194418, lon:102.249062, icon:\"fa-plus-square\" },\n { name:\"Selangor\", lat:3.073838, lon:101.518349, icon:\"fa-plus-square\" },\n { name:\"Kuala Lumpur\", lat:3.139003, lon:101.686852, icon:\"fa-plus-square\" },\n]\nreturn msg;\n",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 500,
        "y": 240,
        "wires": [
            [
                "e8b38bd564251aa2"
            ]
        ]
    },
    {
        "id": "b3347a89dbac0b7d",
        "type": "ui_worldmap",
        "z": "0430c6938cb6f325",
        "group": "fc919dea017b5a77",
        "order": 5,
        "width": "30",
        "height": "16",
        "name": "",
        "lat": "",
        "lon": "",
        "zoom": "",
        "layer": "",
        "cluster": "",
        "maxage": "",
        "usermenu": "hide",
        "layers": "hide",
        "panit": "false",
        "panlock": "false",
        "zoomlock": "false",
        "hiderightclick": "true",
        "coords": "none",
        "showgrid": "false",
        "allowFileDrop": "false",
        "path": "/worldmap",
        "mapname": "",
        "mapurl": "",
        "mapopt": "",
        "mapwms": false,
        "x": 700,
        "y": 520,
        "wires": []
    },
    {
        "id": "ca30316a926a9335",
        "type": "ui_button",
        "z": "0430c6938cb6f325",
        "name": "",
        "group": "fc919dea017b5a77",
        "order": 3,
        "width": "5",
        "height": "1",
        "passthru": false,
        "label": "Selangor",
        "tooltip": "",
        "color": "",
        "bgcolor": "",
        "className": "",
        "icon": "",
        "payload": "",
        "payloadType": "str",
        "topic": "topic",
        "topicType": "msg",
        "x": 260,
        "y": 360,
        "wires": [
            [
                "c31dd11a8fe91243"
            ]
        ]
    },
    {
        "id": "95ba5a22803b64f2",
        "type": "ui_button",
        "z": "0430c6938cb6f325",
        "name": "",
        "group": "fc919dea017b5a77",
        "order": 4,
        "width": "5",
        "height": "1",
        "passthru": false,
        "label": "Melaka",
        "tooltip": "",
        "color": "",
        "bgcolor": "",
        "className": "",
        "icon": "",
        "payload": "",
        "payloadType": "str",
        "topic": "topic",
        "topicType": "msg",
        "x": 260,
        "y": 420,
        "wires": [
            [
                "d6168d1294dcc3ca"
            ]
        ]
    },
    {
        "id": "c31dd11a8fe91243",
        "type": "function",
        "z": "0430c6938cb6f325",
        "name": "Zoom To Selangor",
        "func": "msg.payload = { \"command\": { \"lat\":3.073838, \"lon\":101.518349, \"zoom\":10 }};\nreturn msg;\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 470,
        "y": 360,
        "wires": [
            [
                "e8b38bd564251aa2"
            ]
        ]
    },
    {
        "id": "d6168d1294dcc3ca",
        "type": "function",
        "z": "0430c6938cb6f325",
        "name": "Zoom To Melaka",
        "func": "msg.payload = { \"command\": { \"lat\":2.194418, \"lon\":102.249062, \"zoom\":12 }};\nreturn msg;\n",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 470,
        "y": 420,
        "wires": [
            [
                "e8b38bd564251aa2"
            ]
        ]
    },
    {
        "id": "046746197c8016cd",
        "type": "ui_button",
        "z": "0430c6938cb6f325",
        "name": "",
        "group": "fc919dea017b5a77",
        "order": 2,
        "width": "5",
        "height": "1",
        "passthru": false,
        "label": "Zoom Out",
        "tooltip": "",
        "color": "",
        "bgcolor": "",
        "className": "",
        "icon": "",
        "payload": "",
        "payloadType": "str",
        "topic": "topic",
        "topicType": "msg",
        "x": 260,
        "y": 300,
        "wires": [
            [
                "3d15c35caaac6c0b"
            ]
        ]
    },
    {
        "id": "3d15c35caaac6c0b",
        "type": "function",
        "z": "0430c6938cb6f325",
        "name": "Zoom Out",
        "func": "msg.payload = { \"command\": { \"lat\":4.210484, \"lon\":101.975769, \"zoom\":8 }};\nreturn msg;\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 500,
        "y": 300,
        "wires": [
            [
                "e8b38bd564251aa2"
            ]
        ]
    },
    {
        "id": "990785eeab5d53b2",
        "type": "ui_button",
        "z": "0430c6938cb6f325",
        "name": "",
        "group": "fc919dea017b5a77",
        "order": 1,
        "width": "5",
        "height": "1",
        "passthru": false,
        "label": "Map All",
        "tooltip": "",
        "color": "",
        "bgcolor": "",
        "className": "",
        "icon": "",
        "payload": "",
        "payloadType": "str",
        "topic": "topic",
        "topicType": "msg",
        "x": 260,
        "y": 240,
        "wires": [
            [
                "4147960bf8bc3e20"
            ]
        ]
    },
    {
        "id": "fc919dea017b5a77",
        "type": "ui_group",
        "name": "Map",
        "tab": "f5b182865a403b56",
        "order": 1,
        "disp": true,
        "width": "30",
        "collapse": false,
        "className": ""
    },
    {
        "id": "f5b182865a403b56",
        "type": "ui_tab",
        "name": "Malaysia",
        "icon": "dashboard",
        "order": 3,
        "disabled": false,
        "hidden": false
    }
]

```

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/6/c63690db8d502af063a1a6f18448e246ed3be698.jpeg)

---

_[View the full topic](https://discourse.nodered.org/t/node-red-world-map-zoom-and-marking/53745)._
