The Pie chart option labelSticks causes overlap


« Back to message list

Enter your email address to get email updates on this topic. You can stop receiving updates by clicking the link in the update email messages.

Posted by Walid on 10th April 2017
Hello,

i'm using pie charts and it's really good working but i don't know how to avoid labels overlaps, labelstick parameter doesn't work.
here are my options:


options: {
   labels: labels,
    tooltips: labels,
    textAccessible:false,
    labelsSticksList: true,
    colors: ['#EC0033','#A0D300','#FFCD00','#00B869','#999999','#FF7300','#004CB0'],
    strokestyle: 'white',
    linewidth: 2,
    shadow: true,
    shadowOffsetx: 2,
    shadowOffsety: 2,
    shadowBlur: 3,
    exploded: 7,
    labelsSticksLength: 45,
    labelsSticksUsecolors: false
      }
    }).draw();


Thank you!
Posted by Richard on 10th April 2017
Hi there,

Well I've made an example using your configuration and it looks like this:

www.rgraph.net/fiddle/view.html/new-pie-chart-issue-with-stciks

(it may take a few seconds for the onload event to fire and create the chart)




Richard
Posted by Walid on 10th April 2017
Thanks for your response, i should have said i'm using SVG chart.

I'm using this SVG chart www.rgraph.net/demos/svg-pie-customised.html

I checked the code many times

<script>
     var data = [xx,xx,xx,xx];
     var labels = ['aaa','bbb','ccc','ddd'];
 
     for (var i=0; i<data.length; ++i) {
         labels[i] = labels[i] + ', ' + data[i] + '%';
    }

    new RGraph.SVG.Pie({
        id: 'chart-container',
        data: data,
options: {
     labels: labels,
      tooltips: labels,
      textAccessible:false,
      labelsSticksList: true,
      colors: ['#EC0033','#A0D300','#FFCD00','#00B869','#999999','#FF7300','#004CB0'],
      strokestyle: 'white',
      linewidth: 2,
      shadow: true,
      shadowOffsetx: 2,
      shadowOffsety: 2,
      shadowBlur: 3,
      exploded: 7,
      labelsSticksLength: 45,
      labelsSticksUsecolors: false
        }
      }).draw();
</script>

The chart is well displayed but without labelstick :-(
Posted by Richard on 10th April 2017
Hi there,

Your code appears to work:

www.rgraph.net/fiddle/view.html/new-pie-chart-issue-with-stciks

The SVG stick labels are a bit wider than the canvas version so you might need to widen your DIV.




Richard
Posted by Walid on 10th April 2017
I don't understant why it doesn't work for me, is it possible to send you a screenshot of my chart?
Posted by Richard on 10th April 2017
Hi there,

Sure. Send it to richardheyes at gmail


Richard

Add a reply

 




« Back to message list
RGraph on social media