I'd like to use a different colour for each series on a line and bar graphs.
Using msg.msg.ui_update works fine for the line chart but not for the bar chart.
{"chartOptions":{"series":[{"name":"One","itemStyle":{"color":"red"}},{"name":"Two","itemStyle":{"color":"green"}},{"name":"Three","itemStyle":{"color":"blue"}}]}}
Am I missing something? I couldn't find a solution on the forum or on the GitHub repository.
Minimal example includes three series with three values each and the two graphs.
[ { "id": "82f8a36524094d08", "type": "ui-chart", "z": "1bd978f6f87ceb72", "group": "137205f95ba536c7", "name": "", "label": "Last 24 hours", "order": 1, "chartType": "line", "category": "Name", "categoryType": "property", "xAxisLabel": "", "xAxisProperty": "DateTime", "xAxisPropertyType": "property", "xAxisType": "time", "xAxisFormat": "", "xAxisFormatType": "{HH}:{mm}", "xmin": "", "xmax": "", "yAxisLabel": "", "yAxisProperty": "Measure", "yAxisPropertyType": "property", "ymin": "", "ymax": "", "bins": 10, "action": "replace", "stackSeries": false, "pointShape": "false", "pointRadius": 4, "showLegend": true, "removeOlder": "1", "removeOlderUnit": "86400", "removeOlderPoints": "", "colors": [ "#0095ff", "#ff0000", "#ff7f0e", "#2ca02c", "#a347e1", "#d62728", "#ff9896", "#9467bd", "#c5b0d5" ], "textColor": [ "#666666" ], "textColorDefault": true, "gridColor": [ "#e5e5e5" ], "gridColorDefault": true, "width": 6, "height": "6", "className": "", "interpolation": "smooth", "x": 644.8571429252625, "y": 311.5714285373688, "wires": [ [] ] }, { "id": "1840cbbd40732e40", "type": "ui-button", "z": "1bd978f6f87ceb72", "group": "137205f95ba536c7", "name": "", "label": "Update", "order": 3, "width": "3", "height": "1", "emulateClick": false, "tooltip": "", "color": "", "bgcolor": "", "className": "", "icon": "", "iconPosition": "left", "payload": "", "payloadType": "str", "topic": "topic", "topicType": "msg", "buttonColor": "", "textColor": "", "iconColor": "", "enableClick": true, "enablePointerdown": false, "pointerdownPayload": "", "pointerdownPayloadType": "str", "enablePointerup": false, "pointerupPayload": "", "pointerupPayloadType": "str", "x": 184.85714292526245, "y": 191.57142853736877, "wires": [ [ "94965da6919d18af" ] ] }, { "id": "fd9402f400dbee45", "type": "debug", "z": "1bd978f6f87ceb72", "name": "debug 1", "active": true, "tosidebar": true, "console": false, "tostatus": false, "complete": "true", "targetType": "full", "statusVal": "", "statusType": "auto", "x": 624.8571429252625, "y": 371.5714285373688, "wires": [] }, { "id": "94965da6919d18af", "type": "change", "z": "1bd978f6f87ceb72", "name": "Values and Format", "rules": [ { "t": "set", "p": "payload", "pt": "msg", "to": "[ { \"Name\": \"One\", \"DateTime\": 1782723600000, \"Measure\": 20 }, { \"Name\": \"One\", \"DateTime\": 1782734400000, \"Measure\": 40 }, { \"Name\": \"One\", \"DateTime\": 1782745200000, \"Measure\": 30 }, { \"Name\": \"Two\", \"DateTime\": 1782723600000, \"Measure\": 15 }, { \"Name\": \"Two\", \"DateTime\": 1782734400000, \"Measure\": 20 }, { \"Name\": \"Two\", \"DateTime\": 1782745200000, \"Measure\": 25 }, { \"Name\": \"Three\", \"DateTime\": 1782723600000, \"Measure\": 10 }, { \"Name\": \"Three\", \"DateTime\": 1782734400000, \"Measure\": 15 }, { \"Name\": \"Three\", \"DateTime\": 1782745200000, \"Measure\": 15 } ]", "tot": "json" }, { "t": "set", "p": "msg.ui_update", "pt": "msg", "to": "{\"chartOptions\":{\"series\":[{\"name\":\"One\",\"itemStyle\":{\"color\":\"red\"}},{\"name\":\"Two\",\"itemStyle\":{\"color\":\"green\"}},{\"name\":\"Three\",\"itemStyle\":{\"color\":\"blue\"}}]}}", "tot": "json" } ], "action": "", "property": "", "from": "", "to": "", "reg": false, "x": 270, "y": 300, "wires": [ [ "82f8a36524094d08", "fd9402f400dbee45", "e7034cca480c88d9" ] ] }, { "id": "1943ea31d49f3183", "type": "ui-chart", "z": "1bd978f6f87ceb72", "group": "137205f95ba536c7", "name": "", "label": "Last values", "order": 2, "chartType": "bar", "category": "", "categoryType": "none", "xAxisLabel": "", "xAxisProperty": "Name", "xAxisPropertyType": "property", "xAxisType": "category", "xAxisFormat": "", "xAxisFormatType": "auto", "xmin": "", "xmax": "", "yAxisLabel": "", "yAxisProperty": "Measure", "yAxisPropertyType": "property", "ymin": "10", "ymax": "", "bins": 10, "action": "replace", "stackSeries": false, "pointShape": "circle", "pointRadius": 4, "showLegend": true, "removeOlder": 1, "removeOlderUnit": "3600", "removeOlderPoints": "", "colors": [ "#0095ff", "#ff0000", "#ff7f0e", "#2ca02c", "#a347e1", "#d62728", "#ff9896", "#9467bd", "#c5b0d5" ], "textColor": [ "#666666" ], "textColorDefault": true, "gridColor": [ "#e5e5e5" ], "gridColorDefault": true, "width": 6, "height": "6", "className": "", "interpolation": "linear", "x": 634.8571429252625, "y": 451.5714285373688, "wires": [ [] ] }, { "id": "e491d7894fe98fc9", "type": "debug", "z": "1bd978f6f87ceb72", "name": "debug 2", "active": true, "tosidebar": true, "console": false, "tostatus": false, "complete": "true", "targetType": "full", "statusVal": "", "statusType": "auto", "x": 624.8571429252625, "y": 511.5714285373688, "wires": [] }, { "id": "0a92bbc1da8ca25b", "type": "inject", "z": "1bd978f6f87ceb72", "name": "", "props": [ { "p": "payload" } ], "repeat": "", "crontab": "", "once": true, "onceDelay": 0.1, "topic": "", "payload": "[]", "payloadType": "jsonata", "x": 194.85714292526245, "y": 120, "wires": [ [ "7a3fbe5389dcd295" ] ] }, { "id": "e7034cca480c88d9", "type": "change", "z": "1bd978f6f87ceb72", "name": "Last values", "rules": [ { "t": "set", "p": "payload", "pt": "msg", "to": "payload.$each(\t ${\t Name: $[-1]\t },\t function($v) {\t {\t \"Name\": $v.Name,\t \"Measure\": $v.Measure\t }\t }\t)", "tot": "jsonata" } ], "action": "", "property": "", "from": "", "to": "", "reg": false, "x": 250, "y": 440, "wires": [ [ "1943ea31d49f3183", "e491d7894fe98fc9" ] ] }, { "id": "7a3fbe5389dcd295", "type": "junction", "z": "1bd978f6f87ceb72", "x": 460, "y": 120, "wires": [ [ "82f8a36524094d08", "1943ea31d49f3183" ] ] }, { "id": "137205f95ba536c7", "type": "ui-group", "name": "Measures", "page": "a890dc81f8ecdfd8", "width": "12", "height": 1, "order": 1, "showTitle": true, "className": "", "visible": "true", "disabled": "false", "groupType": "default" }, { "id": "a890dc81f8ecdfd8", "type": "ui-page", "name": "Test", "ui": "dc6bb59706498187", "path": "/page1", "icon": "home", "layout": "grid", "theme": "027bb16531d7f9c1", "breakpoints": [ { "name": "Default", "px": "0", "cols": "3" }, { "name": "Tablet", "px": "576", "cols": "6" }, { "name": "Small Desktop", "px": "768", "cols": "9" }, { "name": "Desktop", "px": "1024", "cols": "12" } ], "order": 1, "className": "", "visible": "true", "disabled": "false" }, { "id": "dc6bb59706498187", "type": "ui-base", "name": "UI Name", "path": "/dashboard", "appIcon": "", "includeClientData": true, "acceptsClientConfig": [ "ui-notification", "ui-control" ], "showPathInSidebar": false, "headerContent": "page", "navigationStyle": "default", "titleBarStyle": "fixed", "showReconnectNotification": true, "notificationDisplayTime": 1, "showDisconnectNotification": true, "allowInstall": true }, { "id": "027bb16531d7f9c1", "type": "ui-theme", "name": "Theme Name", "colors": { "surface": "#ffffff", "primary": "#0094ce", "bgPage": "#eeeeee", "groupBg": "#ffffff", "groupOutline": "#cccccc" }, "sizes": { "density": "default", "pagePadding": "12px", "groupGap": "12px", "groupBorderRadius": "4px", "widgetGap": "12px" } }, { "id": "16623ea290354adf", "type": "global-config", "env": [], "modules": { "@flowfuse/node-red-dashboard": "1.30.2" } } ]
