3

I'm stuck at google visualization api pie chart. Percent labels are mis-aligned a bit Here is options

coreData = {
  options: {
    width: '550',
    height: '400',
    chartArea: {
          height: "90%",
          width: "90%"
    },
  }
};

And here is result : enter image description here

As You can see there is 62 number sliced (62.7 should be) How do i place them correct? Also I'm using bootstrap3 and inspected css, everything seems correct and no overrides here

Yohanes Gultom
  • 3,782
  • 2
  • 25
  • 38
QUIPHOP
  • 93
  • 7
  • i've seen this happen when the chart is drawn for the first time, while the container is hidden -- is that the case here? – WhiteHat Mar 01 '17 at 16:32
  • Figured out the trouble. Well, this chart contains inside
  • tag, if I move out chart outside everything seems good as expected. But, i still don't know which style was overrided. Would be good to know which style rule may cause this issue
    • – QUIPHOP Mar 01 '17 at 18:52
  • @WhiteHat I'll double check that. In my case this graph is hidden by default. Good idea – QUIPHOP Mar 01 '17 at 19:17
  • if that's the case and it is too difficult to wait until visible before drawing, try setting a specific height and width in chart options... – WhiteHat Mar 01 '17 at 19:25
  • Solved! Thanks @WhiteHat . So, the chart was tryin' to draw itself while it's container had class 'hidden'. I changed the init logic and now it's drawing correct. Thanks again – QUIPHOP Mar 02 '17 at 09:04