[{"data":1,"prerenderedAt":505},["ShallowReactive",2],{"blog-\u002Fblog\u002F2024\u002F05\u002Fmapping-location-on-dashboard-2":3},{"id":4,"title":5,"body":6,"description":12,"extension":494,"meta":495,"navigation":500,"path":501,"seo":502,"stem":503,"__hash__":504},"blog\u002Fblog\u002F2024\u002F05\u002Fmapping-location-on-dashboard-2.md","Mapping location data within Node-RED Dashboard 2.0.",{"type":7,"value":8,"toc":482},"minimark",[9,13,22,27,37,61,65,74,104,113,126,130,133,153,159,183,189,206,212,237,243,263,269,314,318,329,336,353,359,363,370,375,402,406,429,436,440,447,452,468,475,479],[10,11,12],"p",{},"Fleet management in IoT uses sensors and software to collect real-time data on vehicles, such as location, fuel consumption, and driver behavior. This data allows companies to optimize routes, reduce costs, improve safety, and enhance overall operational efficiency of their fleet. Building an application that allows the tracking of location to support Fleet management is what this post is about.",[10,14,15,16,21],{},"Before moving further, make sure you have installed Dashboard 2.0. If you are new to Dashboard 2.0, please refer to ",[17,18,20],"a",{"href":19},"\u002Fblog\u002F2024\u002F03\u002Fdashboard-getting-started\u002F","Getting Started with Dashboard 2.0"," for more information.",[23,24,26],"h2",{"id":25},"installing-world-map-custom-node","Installing world map custom node",[10,28,29,30,36],{},"To render an interactive world map webpage for plotting location data, we will use a popular custom node called ",[17,31,35],{"href":32,"rel":33},"https:\u002F\u002Fflows.nodered.org\u002Fnode\u002Fnode-red-contrib-web-worldmap",[34],"nofollow","node-red-contrib-web-worldmap-page",". This node offers extensive features enabling us to render a world map and plot various items with different icons, colors, NATO symbologies, ranges, and more.",[38,39,40,44,47,50,58],"ol",{},[41,42,43],"li",{},"Click the Node-RED Settings (top-right).",[41,45,46],{},"Click \"Manage Palette\".",[41,48,49],{},"Switch to the \"Install\" tab.",[41,51,52,53,57],{},"Search for ",[54,55,56],"code",{},"node-red-contrib-web-worldmap",".",[41,59,60],{},"Click \"Install\".",[23,62,64],{"id":63},"retrieving-location-data","Retrieving location Data",[10,66,67,68,73],{},"Before plotting locations, we need to obtain the data first. For this purpose, we will utilize the ",[17,69,72],{"href":70,"rel":71},"https:\u002F\u002Ftfe-opendata.readme.io\u002Fdocs\u002Fgetting-started",[34],"Edenburg Open Public Transportation API",". This API provides the live locations of all of Edenburg's public buses and trams, enabling us to access the necessary data for plotting on Worldmap within Dashboard 2.0.",[38,75,76,84],{},[41,77,78,79,83],{},"Drag an ",[80,81,82],"strong",{},"Inject"," node onto the canvas and set the repeat property to a 20-second interval.",[41,85,86,87,90,91,94,95,98,99,103],{},"Drag an HTTP request node onto the canvas, Dobule-click on it and choose ",[80,88,89],{},"GET"," method, and enter ",[54,92,93],{},"https:\u002F\u002Ftfe-opendata.com\u002Fapi\u002Fv1\u002Fvehicle_locations"," in the URL field and select return  as ",[80,96,97],{},"a parsed json object",". This API is public, so no need for environment variables. For private APIs, consider using ",[17,100,102],{"href":101},"\u002Fblog\u002F2023\u002F01\u002Fenvironment-variables-in-node-red","environment variables"," for security.",[10,105,106],{},[107,108],"img",{"alt":109,"dataZoomable":110,"src":111,"title":112},"\"Screenshot of the HTTP request node configuration for retrieving data from the API\"","","\u002Fblog\u002F2024\u002F05\u002Fimages\u002Fmapping-location-on-dashboard-2-http-request-node.png","Screenshot of the HTTP request node configuration for retrieving data from the API",[38,114,116],{"start":115},3,[41,117,118,119,121,122,125],{},"Connect the ",[80,120,82],{}," node's output to the ",[80,123,124],{},"HTTP request"," node's input.",[23,127,129],{"id":128},"formatting-location-data","Formatting Location Data",[10,131,132],{},"To ensure compatibility with the Worldmap custom node, we need to format the location data appropriately.",[38,134,135],{},[41,136,137,138,141,142,145,146,149,150,57],{},"Drag the ",[80,139,140],{},"Change"," node onto the canvas, and set the ",[54,143,144],{},"msg.payload"," to ",[54,147,148],{},"msg.payload.vehicles",", and give it name ",[80,151,152],{},"Set payload",[10,154,155],{},[107,156],{"alt":157,"dataZoomable":110,"src":158,"title":157},"Screenshot of the Change node setting the payload to the vehicles JSON array containing actual vehicle location data","\u002Fblog\u002F2024\u002F05\u002Fimages\u002Fmapping-location-on-dashboard-2-change-node.png",[38,160,162,169],{"start":161},2,[41,163,164,165,168],{},"Drag a ",[80,166,167],{},"Split"," node onto the canvas.",[41,170,171,172,174,175,178,179,182],{},"Add another ",[80,173,140],{}," node to the canvas. Configure it to set and delete properties as shown in the image below, and give it name ",[80,176,177],{},"Change and delete properties",". By changing and deleting properties of the location, we ensure that only the properties acceptable by the ",[80,180,181],{},"Worldmap"," node are included in the location data.",[10,184,185],{},[107,186],{"alt":187,"dataZoomable":110,"src":188,"title":187},"Screenshot of the Change node configuring properties to ensure compatibility with the Worldmap node","\u002Fblog\u002F2024\u002F05\u002Fimages\u002Fmapping-location-on-dashboard-2-change-node-changing-and-deleting-properties.png",[38,190,192],{"start":191},4,[41,193,164,194,197,198,201,202,205],{},[80,195,196],{},"Switch"," node onto the canvas and add conditions to check if ",[54,199,200],{},"msg.payload.vehicle_type"," is equal to ",[80,203,204],{},"tram"," or not.",[10,207,208],{},[107,209],{"alt":210,"dataZoomable":110,"src":211,"title":210},"Screenshot of the Switch node checking if the vehicle type is tram or not","\u002Fblog\u002F2024\u002F05\u002Fimages\u002Fmapping-location-on-dashboard-2-switch-node-checking-is-vehicale-type-is-tram-or-not.png",[38,213,215],{"start":214},5,[41,216,171,217,219,220,223,224,145,227,230,231,145,234,57],{},[80,218,140],{}," node to the canvas and give it a name ",[80,221,222],{},"set icon and icon color for tram",". Set ",[54,225,226],{},"msg.payload.icon",[80,228,229],{},"fa-train"," and ",[54,232,233],{},"msg.payload.iconColor",[80,235,236],{},"yellow",[10,238,239],{},[107,240],{"alt":241,"dataZoomable":110,"src":242,"title":241},"Screenshot of the Change node setting the icon and icon color for tram","\u002Fblog\u002F2024\u002F05\u002Fimages\u002Fmapping-location-on-dashboard-2-change-node-setting-icon-for-tram.png",[38,244,246],{"start":245},7,[41,247,171,248,219,250,223,253,145,255,230,258,145,260,57],{},[80,249,140],{},[80,251,252],{},"set icon and icon color for bus",[54,254,226],{},[80,256,257],{},"bus",[54,259,233],{},[80,261,262],{},"red",[10,264,265],{},[107,266],{"alt":267,"dataZoomable":110,"src":268,"title":267},"Screenshot of the Change node setting the icon and icon color for bus","\u002Fblog\u002F2024\u002F05\u002Fimages\u002Fmapping-location-on-dashboard-2-change-node-setting-icon-for-bus.png",[38,270,272,289],{"start":271},8,[41,273,118,274,276,277,279,280,282,283,285,286,288],{},[80,275,124],{}," node's output to the input of the ",[80,278,140],{}," node named ",[80,281,152],{},", and connect the output of that ",[80,284,140],{}," node to the input of the ",[80,287,167],{}," node.",[41,290,291,292,285,294,279,296,298,299,301,302,304,305,279,307,309,310,279,312,57],{},"Then, connect the output of the ",[80,293,167],{},[80,295,140],{},[80,297,177],{},", and connect the output of the \"Change and delete properties\" node to the input of the ",[80,300,196],{}," node. Then ",[80,303,196],{}," node's first output to the input of the ",[80,306,140],{},[80,308,222],{},", and its second output to the input of the ",[80,311,140],{},[80,313,252],{},[23,315,317],{"id":316},"plotting-location-data-on-worldmap","Plotting location data on Worldmap",[38,319,320],{},[41,321,164,322,324,325,328],{},[80,323,181],{}," node onto the canvas. Set the path to ",[80,326,327],{},"\u002Fworldmap"," and keep the rest of the settings unchanged, although you can modify other properties according to your preferences.",[10,330,331],{},[107,332],{"alt":333,"dataZoomable":110,"src":334,"title":335},"\"Screenshot displaying the configuration of the Worldmap custom node\"","\u002Fblog\u002F2024\u002F05\u002Fimages\u002Fmapping-location-on-dashboard-2-worldmap-node.png","Screenshot displaying the configuration of the Worldmap custom node",[38,337,338,345],{"start":161},[41,339,340,341,344],{},"With the ",[80,342,343],{},"worldmap"," node configured, it will generate a world map with plotted data accessible at the specified path.",[41,346,118,347,350,351,125],{},[80,348,349],{},"Function"," node's output to ",[80,352,181],{},[10,354,355,356,57],{},"Now we have successfully created a page with a world map displaying plotted vehicle location data. To confirm, you can visit ",[54,357,358],{},"https:\u002F\u002F\u003Cyour-instance-name>.flowfuse.cloud\u002Fworldmap",[23,360,362],{"id":361},"rendering-map-on-dashboard-20","Rendering map on Dashboard 2.0",[10,364,365,366,369],{},"To render worlmap webpage on dashboard 2.0 we will use ",[80,367,368],{},"iframe"," custom widget which will allow us to embed an external webpage into Dashboard 2.0 applications using an iframe.",[371,372,374],"h3",{"id":373},"installing-iframe-custom-widget","Installing iframe custom widget",[38,376,377,380,386,393,398],{},[41,378,379],{},"Click the Node-RED Settings (top-right)",[41,381,382,383],{},"Click ",[80,384,385],{},"Manage Palette",[41,387,388,389,392],{},"Switch to the ",[80,390,391],{},"Install"," tab",[41,394,52,395],{},[54,396,397],{},"@flowfuse\u002Fnode-red-dashboard-2-ui-iframe",[41,399,382,400],{},[80,401,391],{},[371,403,405],{"id":404},"rendering-worlmap-on-dashboard-20","Rendering worlmap on Dashboard 2.0",[38,407,408,413,423],{},[41,409,78,410,412],{},[80,411,368],{}," widget onto the canvas.",[41,414,415,416,230,419,422],{},"Select ",[80,417,418],{},"ui-group",[80,420,421],{},"ui-base"," for it, where you want to render the webpage.",[41,424,425,426,57],{},"Set height and width for it according to your preference and set URL to ",[80,427,428],{},"\u002Fworlmap",[10,430,431],{},[107,432],{"alt":433,"dataZoomable":110,"src":434,"title":435},"\"Screenshot showing configurations of iframe widget for rendering worlmap page on dashboard\"","\u002Fblog\u002F2024\u002F05\u002Fimages\u002Fmapping-location-on-dashboard-2-iframe-widget.png","Screenshot showing configurations of iframe widget for rendering worlmap page on dashboard",[23,437,439],{"id":438},"deploying-the-flow","Deploying the flow",[10,441,442],{},[107,443],{"alt":444,"dataZoomable":110,"src":445,"title":446},"\"Image displaying live locations of UK public transport on the dashboard\"","\u002Fblog\u002F2024\u002F05\u002Fimages\u002Fmapping-location-on-dashboard-2-uk-live-transport.gif","Image displaying live locations of UK public transport on the dashboard",[448,449],"render-flow",{":height":450,"flow":451},"200","W3siaWQiOiI0ZTQ1ZThlZjg3MGI4NmZiIiwidHlwZSI6Imdyb3VwIiwieiI6ImVhY2M2OGU3MmYxMjBiMGUiLCJzdHlsZSI6eyJzdHJva2UiOiIjYjJiM2JkIiwic3Ryb2tlLW9wYWNpdHkiOiIxIiwiZmlsbCI6IiNmMmYzZmIiLCJmaWxsLW9wYWNpdHkiOiIwLjUiLCJsYWJlbCI6dHJ1ZSwibGFiZWwtcG9zaXRpb24iOiJudyIsImNvbG9yIjoiIzMyMzMzYiJ9LCJub2RlcyI6WyJiNjkxN2Q4My5kMWJhYyIsIjM4NDIxNzEuNGQ0ODdlOCIsImI0ZjJlMmRhYmQ1YjgyMjAiLCI1ZjBkMTQ5ZDRkYzM4OTE2IiwiMmZmN2U5NTAxYWQ1MGNkNSIsImEwOGYwYTgzNmFjNDEyYTciLCJiYzg5MWRjMmFhYWVkYzM5IiwiNzI2YThkYTNmZTkzMGU1NCIsImIzZGQ3ODE0ZWE1MjcwY2EiLCIwYzVkNmJjZmQ3MWQ0MGRhIiwiZTAzN2VlM2QxZjcwMmQyNSIsImQ3Y2E2YzNjZGYxNzZlNGUiXSwieCI6ODE0LCJ5Ijo3NTksInciOjE4NzIsImgiOjMyMn0seyJpZCI6ImI2OTE3ZDgzLmQxYmFjIiwidHlwZSI6Imh0dHAgcmVxdWVzdCIsInoiOiJlYWNjNjhlNzJmMTIwYjBlIiwiZyI6IjRlNDVlOGVmODcwYjg2ZmIiLCJuYW1lIjoiIiwibWV0aG9kIjoiR0VUIiwicmV0Ijoib2JqIiwicGF5dG9xcyI6Imlnbm9yZSIsInVybCI6Imh0dHBzOi8vdGZlLW9wZW5kYXRhLmNvbS9hcGkvdjEvdmVoaWNsZV9sb2NhdGlvbnMiLCJ0bHMiOiIiLCJwZXJzaXN0IjpmYWxzZSwicHJveHkiOiIiLCJpbnNlY3VyZUhUVFBQYXJzZXIiOmZhbHNlLCJhdXRoVHlwZSI6IiIsInNlbmRlcnIiOmZhbHNlLCJoZWFkZXJzIjpbXSwieCI6MTE5MCwieSI6OTAwLCJ3aXJlcyI6W1siYTA4ZjBhODM2YWM0MTJhNyJdXX0seyJpZCI6IjM4NDIxNzEuNGQ0ODdlOCIsInR5cGUiOiJpbmplY3QiLCJ6IjoiZWFjYzY4ZTcyZjEyMGIwZSIsImciOiI0ZTQ1ZThlZjg3MGI4NmZiIiwibmFtZSI6ImdldCB0cmFuc3BvcmF0YXRpb24gZGF0YSIsInByb3BzIjpbeyJwIjoicGF5bG9hZCJ9XSwicmVwZWF0IjoiNSIsImNyb250YWIiOiIiLCJvbmNlIjpmYWxzZSwib25jZURlbGF5IjoiIiwidG9waWMiOiIiLCJwYXlsb2FkIjoiIiwicGF5bG9hZFR5cGUiOiJzdHIiLCJ4Ijo5NzAsInkiOjkwMCwid2lyZXMiOltbImI2OTE3ZDgzLmQxYmFjIl1dfSx7ImlkIjoiYjRmMmUyZGFiZDViODIyMCIsInR5cGUiOiJ3b3JsZG1hcCIsInoiOiJlYWNjNjhlNzJmMTIwYjBlIiwiZyI6IjRlNDVlOGVmODcwYjg2ZmIiLCJuYW1lIjoid29ybGRtYXAiLCJsYXQiOiIiLCJsb24iOiIiLCJ6b29tIjoiIiwibGF5ZXIiOiJPU01HIiwiY2x1c3RlciI6IiIsIm1heGFnZSI6IiIsInVzZXJtZW51Ijoic2hvdyIsImxheWVycyI6InNob3ciLCJwYW5pdCI6ImZhbHNlIiwicGFubG9jayI6ImZhbHNlIiwiem9vbWxvY2siOiJmYWxzZSIsImhpZGVyaWdodGNsaWNrIjoiZmFsc2UiLCJjb29yZHMiOiJtZ3JzIiwic2hvd2dyaWQiOiJmYWxzZSIsInNob3dydWxlciI6ImZhbHNlIiwiYWxsb3dGaWxlRHJvcCI6ImZhbHNlIiwicGF0aCI6Ii93b3JsZG1hcCIsIm92ZXJsaXN0IjoiRFIsQ08sUkEsRE4iLCJtYXBsaXN0IjoiT1NNRyxPU01DLEVzcmlDLEVzcmlTLFVLT1MiLCJtYXBuYW1lIjoiIiwibWFwdXJsIjoiIiwibWFwb3B0IjoiIiwibWFwd21zIjpmYWxzZSwieCI6MjYwMCwieSI6OTAwLCJ3aXJlcyI6W119LHsiaWQiOiI1ZjBkMTQ5ZDRkYzM4OTE2IiwidHlwZSI6ImNvbW1lbnQiLCJ6IjoiZWFjYzY4ZTcyZjEyMGIwZSIsImciOiI0ZTQ1ZThlZjg3MGI4NmZiIiwibmFtZSI6IlJldHJpZXZpbmcsIGZvcm1hdHRpbmcsIGFuZCBwbG90dGluZyBsb2NhdGlvbiBkYXRhIG9uIGEgd29ybGQgbWFwLiIsImluZm8iOiIiLCJ4IjoxMzkwLCJ5Ijo4MDAsIndpcmVzIjpbXX0seyJpZCI6IjJmZjdlOTUwMWFkNTBjZDUiLCJ0eXBlIjoiY29tbWVudCIsInoiOiJlYWNjNjhlNzJmMTIwYjBlIiwiZyI6IjRlNDVlOGVmODcwYjg2ZmIiLCJuYW1lIjoiUmVuZGVyaW5nIGEgbWFwIHdpdGggcGxvdHRlZCBkYXRhIG9uIERhc2hib2FyZCAyLjAuIiwiaW5mbyI6IiIsIngiOjE0NDAsInkiOjk4MCwid2lyZXMiOltdfSx7ImlkIjoiYTA4ZjBhODM2YWM0MTJhNyIsInR5cGUiOiJjaGFuZ2UiLCJ6IjoiZWFjYzY4ZTcyZjEyMGIwZSIsImciOiI0ZTQ1ZThlZjg3MGI4NmZiIiwibmFtZSI6IlNldCBwYXlsb2FkIiwicnVsZXMiOlt7InQiOiJzZXQiLCJwIjoicGF5bG9hZCIsInB0IjoibXNnIiwidG8iOiJwYXlsb2FkLnZlaGljbGVzIiwidG90IjoibXNnIn1dLCJhY3Rpb24iOiIiLCJwcm9wZXJ0eSI6IiIsImZyb20iOiIiLCJ0byI6IiIsInJlZyI6ZmFsc2UsIngiOjEzOTAsInkiOjkwMCwid2lyZXMiOltbIjcyNmE4ZGEzZmU5MzBlNTQiXV19LHsiaWQiOiJiYzg5MWRjMmFhYWVkYzM5IiwidHlwZSI6ImNoYW5nZSIsInoiOiJlYWNjNjhlNzJmMTIwYjBlIiwiZyI6IjRlNDVlOGVmODcwYjg2ZmIiLCJuYW1lIjoiQ2hhbmdlIGFuZCBkZWxldGUgcHJvcGVydGllcyIsInJ1bGVzIjpbeyJ0Ijoic2V0IiwicCI6InBheWxvYWQubGF0IiwicHQiOiJtc2ciLCJ0byI6InBheWxvYWQubGF0aXR1ZGUiLCJ0b3QiOiJtc2cifSx7InQiOiJkZWxldGUiLCJwIjoicGF5bG9hZC5sYXRpdHVkZSIsInB0IjoibXNnIn0seyJ0Ijoic2V0IiwicCI6InBheWxvYWQubG9uIiwicHQiOiJtc2ciLCJ0byI6InBheWxvYWQubG9uZ2l0dWRlIiwidG90IjoibXNnIn0seyJ0IjoiZGVsZXRlIiwicCI6InBheWxvYWQubG9uZ2l0dWRlIiwicHQiOiJtc2cifSx7InQiOiJzZXQiLCJwIjoicGF5bG9hZC5jb2xvciIsInB0IjoibXNnIiwidG8iOiJibHVlIiwidG90Ijoic3RyIn0seyJ0Ijoic2V0IiwicCI6InBheWxvYWQubmFtZSIsInB0IjoibXNnIiwidG8iOiJwYXlsb2FkLnZlaGljbGVfaWQiLCJ0b3QiOiJtc2cifSx7InQiOiJkZWxldGUiLCJwIjoicGF5bG9hZC52ZWhpY2xlX2lkIiwicHQiOiJtc2cifV0sImFjdGlvbiI6IiIsInByb3BlcnR5IjoiIiwiZnJvbSI6IiIsInRvIjoiIiwicmVnIjpmYWxzZSwieCI6MTc3MCwieSI6OTAwLCJ3aXJlcyI6W1siYjNkZDc4MTRlYTUyNzBjYSJdXX0seyJpZCI6IjcyNmE4ZGEzZmU5MzBlNTQiLCJ0eXBlIjoic3BsaXQiLCJ6IjoiZWFjYzY4ZTcyZjEyMGIwZSIsImciOiI0ZTQ1ZThlZjg3MGI4NmZiIiwibmFtZSI6IiIsInNwbHQiOiJcXG4iLCJzcGx0VHlwZSI6InN0ciIsImFycmF5U3BsdCI6MSwiYXJyYXlTcGx0VHlwZSI6ImxlbiIsInN0cmVhbSI6ZmFsc2UsImFkZG5hbWUiOiIiLCJ4IjoxNTUwLCJ5Ijo5MDAsIndpcmVzIjpbWyJiYzg5MWRjMmFhYWVkYzM5Il1dfSx7ImlkIjoiYjNkZDc4MTRlYTUyNzBjYSIsInR5cGUiOiJzd2l0Y2giLCJ6IjoiZWFjYzY4ZTcyZjEyMGIwZSIsImciOiI0ZTQ1ZThlZjg3MGI4NmZiIiwibmFtZSI6ImlzIHZlaGljYWwgdHlwZSBpcyB0cmFtIiwicHJvcGVydHkiOiJwYXlsb2FkLnZlaGljbGVfdHlwZSIsInByb3BlcnR5VHlwZSI6Im1zZyIsInJ1bGVzIjpbeyJ0IjoiZXEiLCJ2IjoidHJhbSIsInZ0Ijoic3RyIn0seyJ0IjoiZWxzZSJ9XSwiY2hlY2thbGwiOiJ0cnVlIiwicmVwYWlyIjpmYWxzZSwib3V0cHV0cyI6MiwieCI6MjA0MCwieSI6OTAwLCJ3aXJlcyI6W1siMGM1ZDZiY2ZkNzFkNDBkYSJdLFsiZTAzN2VlM2QxZjcwMmQyNSJdXX0seyJpZCI6IjBjNWQ2YmNmZDcxZDQwZGEiLCJ0eXBlIjoiY2hhbmdlIiwieiI6ImVhY2M2OGU3MmYxMjBiMGUiLCJnIjoiNGU0NWU4ZWY4NzBiODZmYiIsIm5hbWUiOiJzZXQgaWNvbiBhbmQgaWNvbiBjb2xvciBmb3IgdHJhbSIsInJ1bGVzIjpbeyJ0Ijoic2V0IiwicCI6InBheWxvYWQuaWNvbiIsInB0IjoibXNnIiwidG8iOiJmYS10cmFpbiIsInRvdCI6InN0ciJ9LHsidCI6InNldCIsInAiOiJwYXlsb2FkLmljb25Db2xvciIsInB0IjoibXNnIiwidG8iOiJ5ZWxsb3ciLCJ0b3QiOiJzdHIifV0sImFjdGlvbiI6IiIsInByb3BlcnR5IjoiIiwiZnJvbSI6IiIsInRvIjoiIiwicmVnIjpmYWxzZSwieCI6MjMxMCwieSI6ODYwLCJ3aXJlcyI6W1siYjRmMmUyZGFiZDViODIyMCJdXX0seyJpZCI6ImUwMzdlZTNkMWY3MDJkMjUiLCJ0eXBlIjoiY2hhbmdlIiwieiI6ImVhY2M2OGU3MmYxMjBiMGUiLCJnIjoiNGU0NWU4ZWY4NzBiODZmYiIsIm5hbWUiOiJzZXQgaWNvbiBhbmQgaWNvbiBjb2xvciBmb3IgYnVzIiwicnVsZXMiOlt7InQiOiJzZXQiLCJwIjoicGF5bG9hZC5pY29uIiwicHQiOiJtc2ciLCJ0byI6ImJ1cyIsInRvdCI6InN0ciJ9LHsidCI6InNldCIsInAiOiJwYXlsb2FkLmljb25Db2xvciIsInB0IjoibXNnIiwidG8iOiJyZWQiLCJ0b3QiOiJzdHIifV0sImFjdGlvbiI6IiIsInByb3BlcnR5IjoiIiwiZnJvbSI6IiIsInRvIjoiIiwicmVnIjpmYWxzZSwieCI6MjMxMCwieSI6OTQwLCJ3aXJlcyI6W1siYjRmMmUyZGFiZDViODIyMCJdXX0seyJpZCI6ImQ3Y2E2YzNjZGYxNzZlNGUiLCJ0eXBlIjoidWktaWZyYW1lIiwieiI6ImVhY2M2OGU3MmYxMjBiMGUiLCJnIjoiNGU0NWU4ZWY4NzBiODZmYiIsIm5hbWUiOiIiLCJncm91cCI6IjE1ZDJkZmE1NWU5OWVhNDMiLCJvcmRlciI6MCwic3JjIjoiL3dvcmxkbWFwIiwid2lkdGgiOiIxMiIsImhlaWdodCI6IjEwIiwieCI6MTM3MCwieSI6MTA0MCwid2lyZXMiOltdfSx7ImlkIjoiMTVkMmRmYTU1ZTk5ZWE0MyIsInR5cGUiOiJ1aS1ncm91cCIsIm5hbWUiOiJVLksgVHJhbnNwb3J0YXRpb24gTGl2ZSIsInBhZ2UiOiJlMDk4ZTMwNDdiNGE0ZWFhIiwid2lkdGgiOiIxMiIsImhlaWdodCI6IjEiLCJvcmRlciI6LTEsInNob3dUaXRsZSI6ZmFsc2UsImNsYXNzTmFtZSI6IiIsInZpc2libGUiOiJ0cnVlIiwiZGlzYWJsZWQiOiJmYWxzZSJ9LHsiaWQiOiJlMDk4ZTMwNDdiNGE0ZWFhIiwidHlwZSI6InVpLXBhZ2UiLCJuYW1lIjoiVS5LIFRyYW5zcG9ydGF0aW9uIExpdmUiLCJ1aSI6ImMyZTFhYTU2ZjUwZjAzYmQiLCJwYXRoIjoiL3dvcmxkbWFwIiwiaWNvbiI6ImVhcnRoIiwibGF5b3V0IjoiZ3JpZCIsInRoZW1lIjoiMTI5ZTk5NTc0ZGVmOTBhMyIsIm9yZGVyIjotMSwiY2xhc3NOYW1lIjoiIiwidmlzaWJsZSI6InRydWUiLCJkaXNhYmxlZCI6ImZhbHNlIn0seyJpZCI6ImMyZTFhYTU2ZjUwZjAzYmQiLCJ0eXBlIjoidWktYmFzZSIsIm5hbWUiOiJEYXNoYm9hcmQiLCJwYXRoIjoiL2Rhc2hib2FyZCIsInNob3dQYXRoSW5TaWRlYmFyIjpmYWxzZSwibmF2aWdhdGlvblN0eWxlIjoiZGVmYXVsdCJ9LHsiaWQiOiIxMjllOTk1NzRkZWY5MGEzIiwidHlwZSI6InVpLXRoZW1lIiwibmFtZSI6IkFub3RoZXIgVGhlbWUiLCJjb2xvcnMiOnsic3VyZmFjZSI6IiMwMDAwMDAiLCJwcmltYXJ5IjoiI2ZmNDAwMCIsImJnUGFnZSI6IiNmMGYwZjAiLCJncm91cEJnIjoiI2ZmZmZmZiIsImdyb3VwT3V0bGluZSI6IiNkOWQ5ZDkifSwic2l6ZXMiOnsicGFnZVBhZGRpbmciOiI5cHgiLCJncm91cEdhcCI6IjEycHgiLCJncm91cEJvcmRlclJhZGl1cyI6IjlweCIsIndpZGdldEdhcCI6IjZweCJ9fV0=",[38,453,454,461],{},[41,455,456,457,460],{},"With your flow updated to include the above, click the ",[80,458,459],{},"Deploy"," button in the top-right of the Node-RED Editor.",[41,462,463,464,467],{},"Locate the ",[80,465,466],{},"Open Dashboard"," button at the top-right corner of the Dashboard 2.0 sidebar and click on it to navigate to the dashboard.",[10,469,470,471,57],{},"Now you can view the live location of Edinburgh public transport vehicles on the dashboard. Additionally, clicking on each vehicle reveals further details such as its name, speed, and other properties you've included. Moreover, if you wish to track the live locations of your own vehicles instead of Edinburgh's public transport vehicles, you can connect your devices and access GPS and sensor data using the ",[17,472,474],{"href":473},"\u002Fplatform\u002Fdevice-agent\u002F","Flowfuse device agent",[23,476,478],{"id":477},"conclusion","Conclusion",[10,480,481],{},"In conclusion, this guide shows an easy way to map location data on Dashboard 2.0. By following these steps, you can make interactive dashboards that give you real-time info, useful for things like managing fleets and tracking logistics.",{"title":110,"searchDepth":161,"depth":161,"links":483},[484,485,486,487,488,492,493],{"id":25,"depth":161,"text":26},{"id":63,"depth":161,"text":64},{"id":128,"depth":161,"text":129},{"id":316,"depth":161,"text":317},{"id":361,"depth":161,"text":362,"children":489},[490,491],{"id":373,"depth":115,"text":374},{"id":404,"depth":115,"text":405},{"id":438,"depth":161,"text":439},{"id":477,"depth":161,"text":478},"md",{"navTitle":5,"excerpt":496},{"type":7,"value":497},[498],[10,499,12],{},true,"\u002Fblog\u002F2024\u002F05\u002Fmapping-location-on-dashboard-2",{"title":5,"description":12},"blog\u002F2024\u002F05\u002Fmapping-location-on-dashboard-2","R9T4PU9zb0IzhO-DIt91P17KWOMRTzju4iaBZVqe6W0",1780070551786]