g.raphael icon indicating copy to clipboard operation
g.raphael copied to clipboard

pie chart with slices of zero size

Open vedmack opened this issue 13 years ago • 7 comments

Hi

I'm trying to draw a pie chart with several slices and encountered several issues when the slices are zero

for example when I got 3 slices (2 of them are zeros)

http://jsfiddle.net/vedmack/NdpuD/9/ <--- in this case the pie is not drawn at all and the legend is partially shown ( instead of listing all options it shows only some of them + "Others" label instead of showing all of the options)

Also

when there are zero sized slices the colors of the slices are being mixed and displayed wrongly

In this example the "c" slice is green http://jsfiddle.net/vedmack/NdpuD/10/

in this example the "c" slice is red http://jsfiddle.net/vedmack/NdpuD/11/

In both examples above all the colors are getting mixed , in one , "b" is yellow in other its red and the "a" is yellow in one and green in other...

Regards,

Daniel...

vedmack avatar Jun 07 '12 15:06 vedmack

I'm having the same problem, right now I'm using a very ugly solution of adding 1 to 0 values...

LucasSeveryn avatar Jun 07 '12 18:06 LucasSeveryn

what do you mean "adding 1 to 0 values..." do you managed to display a proper legend with 0% and display true legend with the correct slices ? can you modify my jsfiddle to explain it ? Thanks Ahead...

vedmack avatar Jun 08 '12 19:06 vedmack

I don't use legend, I just add 1 to each data entry:

healthdata_display= [ @health+1, (100-@health)+1]

@hp_indicator = @paper.piechart(@hp_pos.x, @hp_pos.y, @hp_radius, healthdata_display, {colors:["#57ff53","#ae0800"], smooth: true, stroke: "#57ff53"})

It's an awful solution but I can't think of anything else. And I dont use legend, I use this library to display a circular healthbar in a game :D

LucasSeveryn avatar Jun 08 '12 21:06 LucasSeveryn

Big Thanks for the patch, But any ideas why when a "paper.circle" is drawn instead of "paper.path" (cause there is only one value > 0 and all the rest are zeros) The ".hover(function () {" on the pie is not being triggered and also ".mousemove" and ".mouseout" are not being fired (when there are at least two values > 0 all works just fine)

vedmack avatar Jun 19 '12 11:06 vedmack

Ok fixed the issue from the "A fix for issue #155" :) I imitated the behavior of the case where there was a single slice (line 49 if (len == 1) {...) and now I applied it to the case when there is a single slice with value > 0 and all others slices are = ZERO , it can be found on https://github.com/vedmack/g.raphael/blob/master/g.pie.js between line 108 and 145 - I know it can be done less uglier... ;)

vedmack avatar Jun 19 '12 12:06 vedmack

Hi, anyone know what happened to this issue or this entire project as a whole? Is it dead?

totszwai avatar Nov 20 '13 14:11 totszwai

@totszwai , you can take a look at my fix (comment above you), It worked for me.

vedmack avatar Nov 20 '13 14:11 vedmack