ApexChart JS Pie chart legend can't break column in right position - javascript

I need dynamic columns for legend labels in Pie chart, but if the legend position is right or left, this legend use scroll, how can i use scroll and more than one column.
**Now **
enter image description here
Need
enter image description here
I need this with scroll to.

Related

How remove paddings and align to start position bars in chartjs?

How remove paddings beetwen bars and align from start(fix all bars to left) in chartjs?
I know about empty strings in labels for fill empty area, but i need correct way to resolve this problem (if it is)enter image description here

Is there any way to provide left margin on y axis label to avoid the chart moving Chartjs?

I am using Chart JS for bar representation. and using this link https://stackblitz.com/edit/ng2-chart-scrollable?file=src%2Fapp%2Fapp.component.html,src%2Fapp%2Fapp.component.ts for scrolling the bar chart.
In vertical bar, everything working fine. But in horizontal bar while scrolling the y axis moving.
It is because of the characters length the chart is moving on scroll.
In the above picture, you can see the chart position.
this is second picture the chart position slightly moves to left.
i Know this is because of the character, I have tried some logic like adding empty spaces based on maximum character shown to other words which is less than the bigger words.
Is there any way to make it fixed without moving. or can we try adding margin left before y axis label, if yes how to add a margin to it. Because in highchart I have seen something like margin left fixes this thing, But I don't know how to implement in chartjs

How to change clustered column chart group fill color

I want to change every column in clustered column chart that be all group same color. I want the same result in the image attached.
Apex chart or am chart or any other library.
i can do this only all group has same color.

Tooltip placement in amcharts stacked column graph

I am trying to make custom html tooltip in amcharts stacked column graph.
series.tooltipHTML = `
<h2>{name}</h2>
`;
However the tooltips on hovering, instead of coming at the position of the column always comes in the middle of the graph for every column. I have tried all the options like toolTipY given in the demos. How to make the tooltip's position correct that is on top or bottom of the respective column slices.
Codepen with problem

AmCharts hovering shows div name

Whem I'm hovering on the chart, the div-id where the chart was drawn shows up (CATEGORY in this example). Is there anyway to hide this?

Categories

Resources