Way to toggle x-axis label-grouping in Chart.js? - javascript

I'm trying to make a vertical bar chart (aka "column graph") using Chart.js with multiple datasets that does not group by the x-axis labels. I would like each column to have its own label and I would like datasets to be grouped only by color. Chart.js automatically takes the first data entry of each dataset and plots it on the first x-axis label, and so on. Rather than that, I want my chart to look like this:
If this is simply a terrible way of presenting data, I'm open to other suggestions... But I like the alphabetical sorting of the show titles and the color-coded grouping of networks.

Related

Javascript D3.js Nested Axis Labels for Radar Chart

I would like to add nested axis Labels to my radar chart. All online resources just show a singular axis.
An example of the image I am trying to reproduce is shown in the below figure.
The axis is Management.sr_lvl_1, Management.sr_lvl_2, Management.sr_lvl_3... However, I want the word management to appear only once in the label which spans across all sr_lvl

Multiple Point Selection chartJS

I'm trying to draw graphs with multiple datasets in chartJS. Some datasets are grouped together and users should be able to select those grouped datasets with a single click on the group.
Example:
Before select
After select
Is this possible in chartJS?
Thanks

One legend, multiple charts Chart JS

I have two pie charts with different data but same labels and background colors. How can I create a standalone legend (a legend without a chart) using ChartJS so that the legend corresponds to both the pie charts at the same time?
I tried creating a pie chart with the data array set to an array of 0s. However, that causes an empty pie chart to be generated, which takes up a lot of space; so that's a no go.
Any help would be deeply appreciated.

Highcharts stacked area chart with background chart

What i would like: (not in highcharts)
Note the gray backround graph showing the average trend
What i currently have: (made with highcharts)
I managed to implement the stacked area chart, but i would like to add the grey average graph in the background.
Could anyone tell me if and how this is possible?
Thanks!
The answer was simply adding the "stack" variable to my series, which allows you to build multiple stacks of "stacked area" charts: one for the actual values, one for the average of last week. Thanks to everyone for their input

Responsive grouped bar chart in d3js with responsive scale values

I am following this example to create grouped bar chart. But the chart lacks responsiveness. I want to run it dynamically in all kinds of devices. I want to make it look something like the below chart(not same as chart above copied from an example of a responsive chart):
And also in above example the x-axis range is overlapped is it possible to make it tilted to so that all values are clear something like below pic so that all x axis range values are displayed.
The responsiveness of the chart is fixed however the scale values overlap on each other and instead of overlapping I want them all to adjust and appear.

Categories

Resources