Hello friends, I hope you are doing well!
I would appreciate it if help me to figure out how to remove shades out of my curves!
Actually, my problem is when I inject data into chart the curves aren't clean! I mean I want to see curves without any shades. I read the documents here but I couldn't find a related parameter for adding/removing shades!
[
{
"id": "ba30230bdd7b910f",
"type": "ui_template",
"z": "c0c06963c97bbd82",
"group": "7b79c772fbaab385",
"name": "",
"order": 1,
"width": 20,
"height": 13,
"format": "<script src=\"https://cdn.jsdelivr.net/npm/apexcharts\"></script>\n<div id=\"chart\"></div>\n\n<script>\n (function(scope) {\n scope.$watch('msg', function(msg) {\n if (msg) {\n // Do something when msg arrives\n var options = {\n series: msg.payload,\n chart: {\n type: 'line',\n stacked: false,\n height: 500,\n zoom: {\n type: 'x',\n enabled: true,\n autoScaleYaxis: true\n },\n // toolbar: {\n // autoSelected: 'zoom'\n // }\n },\n stroke: {\n curve: 'smooth',\n }\n ,\n dataLabels: {\n enabled: false\n },\n markers: {\n size: 0,\n },\n theme: {\n mode: 'dark' // dark , light\n },\n title: {\n text: 'Historic data',\n align: 'left'\n },\n //fill: {\n // type: 'gradient',\n // gradient: {\n // shadeIntensity: 0,\n // inverseColors: false,\n // opacityFrom: 0.5,\n // opacityTo: 0,\n // stops: [0, 90, 100]\n // },\n //},\n yaxis: {\n labels: {\n formatter: function (val) {\n return val;\n },\n },\n // title: {\n // text: 'Price'\n // },\n },\n xaxis: {\n type: 'datetime',\n },\n tooltip: {\n shared: false,\n y: {\n formatter: function (val) {\n return (val / 1000000).toFixed(0)\n }\n }\n }\n };\n\nsetTimeout( ()=> {\n\n if(scope.chart){\n scope.chart.updateOptions(options)\n }\n else {\n scope.chart = new ApexCharts(document.querySelector(\"#chart\"), options);\n scope.chart.render();\n }\n \n}, 1000)\n\n }\n });\n})(scope);\n</script>",
"storeOutMessages": false,
"fwdInMessages": false,
"resendOnRefresh": false,
"templateScope": "local",
"className": "",
"x": 660,
"y": 1080,
"wires": [
[]
]
},
{
"id": "331c581fae67856e",
"type": "function",
"z": "c0c06963c97bbd82",
"name": "Chart | Apex",
"func": "var msg1;\nvar msg2;\nvar apex_chart = [];\n\n\n\nvar chart = [{\n \"series\":[],\n \"labels\":[msg.filename],\n \"data\": []\n}];\n\n\n\nlet columns = 0;\n\nfor(var series in msg.payload[0]) {\n if(series!==\"Timestamp\") {\n chart[0].series.push(series);\n chart[0].data.push([]);\n columns++;\n }\n}\n\n\nfor (var j=0; j<msg.payload.length; j++) {\n for(var i=0;i<columns;i++) {\n chart[0].data[i].push({\"x\":msg.payload[j].Timestamp, \"y\":msg.payload[j][chart[0].series[i]]});\n } \n}\n\nfor (var k = 0; k < chart[0].series.length; k++) {\n apex_chart.push({\n name: chart[0].series[k],\n data: chart[0].data[k]\n })\n}\nmsg1 = { payload: chart }\nmsg2 = { payload: apex_chart }\n\n\n//msg.payload = chart ;\n\n\n\n\n\nreturn [msg1,msg2];\n\n\n\n\n\n\n\n\n\n\n\n\n\n",
"outputs": 2,
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 410,
"y": 1040,
"wires": [
[
"fc4bf11b088a905d"
],
[
"207d795590aa3f4c",
"ba30230bdd7b910f"
]
]
},
{
"id": "fc4bf11b088a905d",
"type": "debug",
"z": "c0c06963c97bbd82",
"name": "debug 343",
"active": false,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 605,
"y": 1000,
"wires": [],
"l": false
},
{
"id": "207d795590aa3f4c",
"type": "debug",
"z": "c0c06963c97bbd82",
"name": "debug 346",
"active": true,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 605,
"y": 1040,
"wires": [],
"l": false
},
{
"id": "29ca60946c853c61",
"type": "inject",
"z": "c0c06963c97bbd82",
"name": "",
"props": [
{
"p": "payload"
}
],
"repeat": "",
"crontab": "",
"once": false,
"onceDelay": 0.1,
"topic": "",
"payload": "[{\"Timestamp\":\"11/15/2023 9:18:06 AM\",\"Tensione fase R\":68,\"Tensione fase S\":229,\"Energia rigenerata totale\":304},{\"Timestamp\":\"11/15/2023 9:18:16 AM\",\"Tensione fase R\":252,\"Tensione fase S\":84,\"Energia rigenerata totale\":198},{\"Timestamp\":\"11/15/2023 9:18:26 AM\",\"Tensione fase R\":324,\"Tensione fase S\":154,\"Energia rigenerata totale\":190},{\"Timestamp\":\"11/15/2023 9:18:36 AM\",\"Tensione fase R\":47,\"Tensione fase S\":48,\"Energia rigenerata totale\":307},{\"Timestamp\":\"11/15/2023 9:18:46 AM\",\"Tensione fase R\":16,\"Tensione fase S\":37,\"Energia rigenerata totale\":-25},{\"Timestamp\":\"11/15/2023 9:18:56 AM\",\"Tensione fase R\":310,\"Tensione fase S\":-34,\"Energia rigenerata totale\":-31},{\"Timestamp\":\"11/15/2023 9:19:06 AM\",\"Tensione fase R\":166,\"Tensione fase S\":279,\"Energia rigenerata totale\":-35},{\"Timestamp\":\"11/15/2023 9:19:16 AM\",\"Tensione fase R\":196,\"Tensione fase S\":-19,\"Energia rigenerata totale\":63},{\"Timestamp\":\"11/15/2023 9:19:26 AM\",\"Tensione fase R\":-47,\"Tensione fase S\":7,\"Energia rigenerata totale\":197},{\"Timestamp\":\"11/15/2023 9:19:36 AM\",\"Tensione fase R\":326,\"Tensione fase S\":98,\"Energia rigenerata totale\":10},{\"Timestamp\":\"11/15/2023 9:19:46 AM\",\"Tensione fase R\":306,\"Tensione fase S\":308,\"Energia rigenerata totale\":-6},{\"Timestamp\":\"11/15/2023 9:19:56 AM\",\"Tensione fase R\":269,\"Tensione fase S\":36,\"Energia rigenerata totale\":-1},{\"Timestamp\":\"11/15/2023 9:20:06 AM\",\"Tensione fase R\":93,\"Tensione fase S\":255,\"Energia rigenerata totale\":206}]",
"payloadType": "json",
"x": 170,
"y": 1060,
"wires": [
[
"331c581fae67856e"
]
]
},
{
"id": "7b79c772fbaab385",
"type": "ui_group",
"name": "Zoomable time series",
"tab": "968b45b75eb8747a",
"order": 5,
"disp": true,
"width": "20",
"collapse": true,
"className": ""
},
{
"id": "968b45b75eb8747a",
"type": "ui_tab",
"name": "Training",
"icon": "dashboard",
"order": 19,
"disabled": false,
"hidden": false
}
]
Thanks in advance for your helps!
