I have this (simplified) data Edit - updated so it's the data actually shown in the bar chart!
[{"day":"Thu","value":9},{"day":"Fri","value":8},{"day":"Sat","value":11},{"day":"Sun","value":12},{"day":"Mon","value":7},{"day":"Tue","value":6},{"day":"Wed","value":8}]
I can display it as a bar chart but line charts are blank
1.Is it possible to get a line chart like this (below) without modifying this data?
If I add some calculated fields such as row, date, datetime then I can produce a line chart.
2. A date eg "2024-11-06" (Wednesday) seems to be interpreted as midnight? The x axis label is for the preceding day
3. What's going on with the repeated day names on the x axis?
4. Neither the chart using dates "2024-11-06" nor the chart using datetimes "2024-11-06T12:00:00Z" has points coinciding with x axis grid lines
5. If I reload the browser tab, the bar chart and the line chart with a linear x axis are refreshed but the timescale charts are not
A flow to reproduce the charts:
[{"id":"4623cf401d6fd345","type":"debug","z":"9d9e116f70efe015","name":"Fettled","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":470,"y":240,"wires":[]},{"id":"51d5f9e533127cbf","type":"ui-chart","z":"9d9e116f70efe015","group":"1039c7f256b85488","name":"Line chart - linear (row)","label":"Line chart - linear (row)","order":1,"chartType":"line","category":"topic","categoryType":"msg","xAxisLabel":"","xAxisProperty":"row","xAxisPropertyType":"property","xAxisType":"linear","xAxisFormat":"","xAxisFormatType":"auto","xmin":"","xmax":"","yAxisLabel":"","yAxisProperty":"value","yAxisPropertyType":"property","ymin":"","ymax":"","bins":10,"action":"replace","stackSeries":false,"pointShape":"circle","pointRadius":4,"showLegend":false,"removeOlder":1,"removeOlderUnit":"3600","removeOlderPoints":"","colors":["#0095ff","#ff0000","#ff7f0e","#2ca02c","#a347e1","#d62728","#ff9896","#9467bd","#c5b0d5"],"textColor":["#666666"],"textColorDefault":true,"gridColor":["#e5e5e5"],"gridColorDefault":true,"width":"3","height":"3","className":"","interpolation":"bezier","x":530,"y":280,"wires":[[]]},{"id":"6a6fa28fe1d49cec","type":"ui-chart","z":"9d9e116f70efe015","group":"77a183e6f60a2085","name":"Bar chart - categorical","label":"Bar chart - categorical","order":1,"chartType":"bar","category":"topic","categoryType":"msg","xAxisLabel":"","xAxisProperty":"day","xAxisPropertyType":"property","xAxisType":"category","xAxisFormat":"","xAxisFormatType":"auto","xmin":"","xmax":"","yAxisLabel":"","yAxisProperty":"value","yAxisPropertyType":"property","ymin":"","ymax":"","bins":10,"action":"replace","stackSeries":false,"pointShape":"circle","pointRadius":4,"showLegend":false,"removeOlder":1,"removeOlderUnit":"3600","removeOlderPoints":"","colors":["#0095ff","#ff0000","#ff7f0e","#2ca02c","#a347e1","#d62728","#ff9896","#9467bd","#c5b0d5"],"textColor":["#666666"],"textColorDefault":true,"gridColor":["#e5e5e5"],"gridColorDefault":true,"width":"3","height":"3","className":"","interpolation":"linear","x":520,"y":80,"wires":[[]]},{"id":"8861c4655e744c6a","type":"ui-chart","z":"9d9e116f70efe015","group":"1039c7f256b85488","name":"Line chart - timescale (date)","label":"Line chart - timescale (date)","order":2,"chartType":"line","category":"topic","categoryType":"msg","xAxisLabel":"","xAxisProperty":"date","xAxisPropertyType":"property","xAxisType":"time","xAxisFormat":"ccc","xAxisFormatType":"custom","xmin":"","xmax":"","yAxisLabel":"","yAxisProperty":"value","yAxisPropertyType":"property","ymin":"","ymax":"","bins":10,"action":"replace","stackSeries":false,"pointShape":"circle","pointRadius":4,"showLegend":false,"removeOlder":1,"removeOlderUnit":"3600","removeOlderPoints":"","colors":["#0095ff","#ff0000","#ff7f0e","#2ca02c","#a347e1","#d62728","#ff9896","#9467bd","#c5b0d5"],"textColor":["#666666"],"textColorDefault":true,"gridColor":["#e5e5e5"],"gridColorDefault":true,"width":"3","height":"3","className":"","interpolation":"bezier","x":540,"y":320,"wires":[[]]},{"id":"d1f59cf61f2a6fa8","type":"template","z":"9d9e116f70efe015","name":"Fettled data","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"[\n {\n \"row\": 1,\n \"day\": \"Thu\",\n \"date\": \"2024-10-31\",\n \"datetime\": \"2024-10-31T12:00:00Z\",\n \"value\": 9\n },\n {\n \"row\": 2,\n \"day\": \"Fri\",\n \"date\": \"2024-11-01\",\n \"datetime\": \"2024-11-01T12:00:00Z\",\n \"value\": 8\n },\n {\n \"row\": 3,\n \"day\": \"Sat\",\n \"date\": \"2024-11-02\",\n \"datetime\": \"2024-11-02T12:00:00Z\",\n \"value\": 11\n },\n {\n \"row\": 4,\n \"day\": \"Sun\",\n \"date\": \"2024-11-03\",\n \"datetime\": \"2024-11-03T12:00:00Z\",\n \"value\": 12\n },\n {\n \"row\": 5,\n \"day\": \"Mon\",\n \"date\": \"2024-11-04\",\n \"datetime\": \"2024-11-04T12:00:00Z\",\n \"value\": 7\n },\n {\n \"row\": 6,\n \"day\": \"Tue\",\n \"date\": \"2024-11-05\",\n \"datetime\": \"2024-11-05T12:00:00Z\",\n \"value\": 6\n },\n {\n \"row\": 7,\n \"day\": \"Wed\",\n \"date\": \"2024-11-06\",\n \"datetime\": \"2024-11-06T12:00:00Z\",\n \"value\": 8\n }\n]","output":"json","x":250,"y":220,"wires":[["51d5f9e533127cbf","8861c4655e744c6a","4623cf401d6fd345","96fa57c79eeba5a1","cff8328641329e91"]]},{"id":"5add8caa8def1387","type":"ui-button","z":"9d9e116f70efe015","group":"77a183e6f60a2085","name":"","label":"Load","order":4,"width":"1","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":110,"y":160,"wires":[["d1f59cf61f2a6fa8","6f9ebdeff9a79f51"]]},{"id":"262bb1544e2ce3b4","type":"ui-button","z":"9d9e116f70efe015","group":"77a183e6f60a2085","name":"","label":"Clear","order":5,"width":"1","height":"1","emulateClick":true,"tooltip":"","color":"","bgcolor":"","className":"","icon":"","iconPosition":"left","payload":"[]","payloadType":"json","topic":"topic","topicType":"msg","buttonColor":"","textColor":"","iconColor":"","enableClick":true,"enablePointerdown":false,"pointerdownPayload":"","pointerdownPayloadType":"str","enablePointerup":false,"pointerupPayload":"","pointerupPayloadType":"str","x":270,"y":300,"wires":[["6a6fa28fe1d49cec","51d5f9e533127cbf","8861c4655e744c6a","96fa57c79eeba5a1","1c81a8a76c260cbc","9dfb883d40d4db9f","cff8328641329e91"]]},{"id":"0f6f0d445122d8da","type":"inject","z":"9d9e116f70efe015","name":"init","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":110,"y":300,"wires":[["262bb1544e2ce3b4"]]},{"id":"96fa57c79eeba5a1","type":"ui-chart","z":"9d9e116f70efe015","group":"1039c7f256b85488","name":"Line chart - timescale (datetime)","label":"Line chart - timescale (datetime)","order":3,"chartType":"line","category":"topic","categoryType":"msg","xAxisLabel":"","xAxisProperty":"datetime","xAxisPropertyType":"property","xAxisType":"time","xAxisFormat":"ccc","xAxisFormatType":"custom","xmin":"","xmax":"","yAxisLabel":"","yAxisProperty":"value","yAxisPropertyType":"property","ymin":"","ymax":"","bins":10,"action":"replace","stackSeries":false,"pointShape":"circle","pointRadius":4,"showLegend":false,"removeOlder":1,"removeOlderUnit":"3600","removeOlderPoints":"","colors":["#0095ff","#ff0000","#ff7f0e","#2ca02c","#a347e1","#d62728","#ff9896","#9467bd","#c5b0d5"],"textColor":["#666666"],"textColorDefault":true,"gridColor":["#e5e5e5"],"gridColorDefault":true,"width":"3","height":"3","className":"","interpolation":"bezier","x":550,"y":360,"wires":[[]]},{"id":"6f9ebdeff9a79f51","type":"template","z":"9d9e116f70efe015","name":"Simple data","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"[\n {\n \"day\": \"Thu\",\n \"value\": 9\n },\n {\n \"day\": \"Fri\",\n \"value\": 8\n },\n {\n \"day\": \"Sat\",\n \"value\": 11\n },\n {\n \"day\": \"Sun\",\n \"value\": 12\n },\n {\n \"day\": \"Mon\",\n \"value\": 7\n },\n {\n \"day\": \"Tue\",\n \"value\": 6\n },\n {\n \"day\": \"Wed\",\n \"value\": 8\n }\n]","output":"json","x":250,"y":120,"wires":[["a777eef4e788d8da","9dfb883d40d4db9f","1c81a8a76c260cbc","6a6fa28fe1d49cec"]]},{"id":"a777eef4e788d8da","type":"debug","z":"9d9e116f70efe015","name":"Simple","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":470,"y":40,"wires":[]},{"id":"9dfb883d40d4db9f","type":"ui-chart","z":"9d9e116f70efe015","group":"77a183e6f60a2085","name":"Simple data - timescale (day)","label":"Simple data - timescale (day)","order":2,"chartType":"line","category":"topic","categoryType":"msg","xAxisLabel":"","xAxisProperty":"day","xAxisPropertyType":"property","xAxisType":"time","xAxisFormat":"ccc","xAxisFormatType":"custom","xmin":"","xmax":"","yAxisLabel":"","yAxisProperty":"value","yAxisPropertyType":"property","ymin":"","ymax":"","bins":10,"action":"replace","stackSeries":false,"pointShape":"circle","pointRadius":4,"showLegend":false,"removeOlder":1,"removeOlderUnit":"3600","removeOlderPoints":"","colors":["#0095ff","#ff0000","#ff7f0e","#2ca02c","#a347e1","#d62728","#ff9896","#9467bd","#c5b0d5"],"textColor":["#666666"],"textColorDefault":true,"gridColor":["#e5e5e5"],"gridColorDefault":true,"width":"3","height":"3","className":"","interpolation":"bezier","x":540,"y":160,"wires":[[]]},{"id":"1c81a8a76c260cbc","type":"ui-chart","z":"9d9e116f70efe015","group":"77a183e6f60a2085","name":"Simple data - linear (day)","label":"Simple data - linear (day)","order":3,"chartType":"line","category":"topic","categoryType":"msg","xAxisLabel":"","xAxisProperty":"day","xAxisPropertyType":"property","xAxisType":"linear","xAxisFormat":"","xAxisFormatType":"auto","xmin":"","xmax":"","yAxisLabel":"","yAxisProperty":"value","yAxisPropertyType":"property","ymin":"","ymax":"","bins":10,"action":"replace","stackSeries":false,"pointShape":"circle","pointRadius":4,"showLegend":false,"removeOlder":1,"removeOlderUnit":"3600","removeOlderPoints":"","colors":["#0095ff","#ff0000","#ff7f0e","#2ca02c","#a347e1","#d62728","#ff9896","#9467bd","#c5b0d5"],"textColor":["#666666"],"textColorDefault":true,"gridColor":["#e5e5e5"],"gridColorDefault":true,"width":"3","height":"3","className":"","interpolation":"bezier","x":530,"y":120,"wires":[[]]},{"id":"cff8328641329e91","type":"ui-chart","z":"9d9e116f70efe015","group":"1039c7f256b85488","name":"Line chart - linear (datetime)","label":"Line chart - linear (datetime)","order":3,"chartType":"line","category":"topic","categoryType":"msg","xAxisLabel":"","xAxisProperty":"datetime","xAxisPropertyType":"property","xAxisType":"linear","xAxisFormat":"ccc","xAxisFormatType":"custom","xmin":"","xmax":"","yAxisLabel":"","yAxisProperty":"value","yAxisPropertyType":"property","ymin":"","ymax":"","bins":10,"action":"replace","stackSeries":false,"pointShape":"circle","pointRadius":4,"showLegend":false,"removeOlder":1,"removeOlderUnit":"3600","removeOlderPoints":"","colors":["#0095ff","#ff0000","#ff7f0e","#2ca02c","#a347e1","#d62728","#ff9896","#9467bd","#c5b0d5"],"textColor":["#666666"],"textColorDefault":true,"gridColor":["#e5e5e5"],"gridColorDefault":true,"width":"3","height":"3","className":"","interpolation":"bezier","x":540,"y":400,"wires":[[]]},{"id":"1039c7f256b85488","type":"ui-group","name":"Fettled Data","page":"e81fa6389c042304","width":"3","height":"1","order":2,"showTitle":true,"className":"","visible":"true","disabled":"false","groupType":"default"},{"id":"77a183e6f60a2085","type":"ui-group","name":"Simple Data","page":"e81fa6389c042304","width":"3","height":"1","order":1,"showTitle":true,"className":"","visible":"true","disabled":"false","groupType":"default"},{"id":"e81fa6389c042304","type":"ui-page","name":"Demo","ui":"d45641ed6d39fea1","path":"/demo","icon":"home","layout":"grid","theme":"0d92c765bfad87e6","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":"d45641ed6d39fea1","type":"ui-base","name":"This is my ui-base","path":"/dashboard","appIcon":"","includeClientData":true,"acceptsClientConfig":["ui-notification","ui-control"],"showPathInSidebar":false,"showPageTitle":true,"navigationStyle":"default","titleBarStyle":"default"},{"id":"0d92c765bfad87e6","type":"ui-theme","name":"Basic Blue Theme","colors":{"surface":"#4d58ff","primary":"#0094ce","bgPage":"#eeeeee","groupBg":"#ffffff","groupOutline":"#cccccc"},"sizes":{"pagePadding":"12px","groupGap":"12px","groupBorderRadius":"4px","widgetGap":"2px","density":"default"}}]
