Semi Doughnut Chart

[mahi2000]

How can I create semi doughnut chart in Canvasjs?

[mahi2000]

Any lead?

[Vishwas R]

Mahi,

Please check this jsfiddle.

[mahi2000]

Thanks Vishwas :)

[mahi2000]

Vishwas, is it possible to remove extra white space from bottom?

[mahi2000]

Any lead to remove the extra white space?

[mahi2000]

Is it possible to remove extra white space from bottom?

[Vishwas R]

Mahi,

Sorry, its not possible to clip the chart. But the only work-around would be to place another div or element on top of chart by setting negative-margin to the next div. Check this example.

[mahi2000]

Ohk.. thanks, I implemented by using overflow:hidden.

Also can we remove the hover effect from semi doughnut hidden area? Currently in your example white background is used and this is why hover effect is not visible.

[mahi2000]

Is it possible to remove hover effect from semi doughnut hidden area? Currently in your example white background is used and this is why hover effect is not visible. For example, canvas has gray background.

[Sunil Urs]

mahi,

You can do so by setting highlightEnabled to false for those dataPoints. Here is an updated example.

—
Sunil Urs

[mahi2000]

Thanks Sunil :)

[cute_cj]

Is it possible to get the data from database or thru user input? Whatever the user will input on the value of x and y it will appear on the chart.

[Vishwas R]

@cute_cj,

Please refer this page for adding data-points from user-input.

For samples on data from database, please download and try the samples based on the technology you are using.