I'm working on a Bar Pie Chart but my values are not lining up. For example, Red data is clearly larger then blue, but blue value is higher.
The data is correct, chart.js doesnt show the area as more, it uses the angle of the circle , which normally would also divede the area normally. And as you can see the angles are correct so to fix your issue you will have to write a custom controller that draws your chart. https://www.chartjs.org/docs/latest/developers/charts.html
Related
I came across this unusual problem. I try to create chart showing top 1 manager(Y axis) by rating (X axis) from each region, with Region added to legend for color differentiation. However, then bars are located on uneven distance from each other, some are closer, other are further from the next one. (picture 1)
Issue seems to go away if I add Region to Y axis above Manager's Name, but then Y axis shows region labels (picture 2), and not managers names. if it's added below or removed, bars go haywire again.
I had the same issue and think it's because PBI is trying to display all the categories from the Legend on the Y axis, which show up as "hidden" or blank bars in between your other bars and make it look like the spacing is random. I was able to fix this by switching from a Clustered Bar to a Stacked Bar chart. Couldn't figure out how to suppress those other legend categories from the Y axis in a Clustered Bar. Hope that helps.
In a bar chart I display two values. OK and Not_OK. Only the bar of OK is displayed in red and the bar of Not_OK in green. I have the feeling APEX assigns color by chance. Can I define the color for the respective value?
You can define the color in the series of your chart. I have built a sample application you can see here.
If both bars are defined in the same series, you can create a column for the color, then reference that column in Color field of the series. If the two bars are defined in different series, you can use the same method, or select a color to use for that series.
I’m using donut chartjs graph to simulate a circle progress bar, with 40 positions in the dataset with green and 60 positions with light gray (simulating a 40% progress bar).
But when I start the graph, all datasets animate, but I would like to keep the gray ones static and animate only the green ones, to simulate a progress bar. Is this possible?
PS: I didn’t use other progress bar lib because I need the stripped effect that I have with 100 positions in my dataset.
Suggestions are welcome.
This question is similar to yours, there are two approaches, or you set up a plugin and draw a circle under the chart or draw two charts one of them is the background with no animation them set both to position absolute.
I have a line chart with two datasets. Initially the Y Axis is 0-100. The first line is roughly a straight line around a value of say 70, the second line is all below say 30. If I zoom the chart vertically by forcing the Y Axis min to 65 and max 75 (ie I want to exam the first line expanded vertically) then when I hover over a data point, the tooltip is missing. Actually I figure it is off the chart (so to speak :-) ).
The tooltip seems to be automatically positioned vertically between the lowest and highest data points, even if one of those data points is way below the chart.
My question: is this a bug or is there a way I can tell chart.js to ignore data points that are off chart when determining tooltip vertical position?
I'd even be happy if the tooltip was always at a fixed vertical position, ie across the top of the chart or centred vertically on the chart.
Using chart.js V2.7.1
Tooltips have two positioning modes, as per the documentation:
Possible modes are:
'average'
'nearest'
'average' mode will place the tooltip at the average position of the items displayed in the tooltip. 'nearest' will place the tooltip at the position of the element closest to the event position.
You can see both modes in operation at the relevant samples page.
average is the default mode. From your description, switching to nearest should resolve your issue.
I am doing a google chart that displays percentage data.
I have got it working already.
The question is the percentage displayed on the chart is white in color which cant be seen clearly. How can i change the color of it to black and if possible individual color for each section.