Use the following codes to see the difference. In the same way you might have displayed the chart on the go dynamically which might impact the position of text.
*Previous Code:* <!DOCTYPE html> <html lang="en-US"> <body> <h1>My Web Page</h1> <div id="outerdiv" style="display:none;"> <div id="piechart"></div> <div> <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js "></script> <script type="text/javascript"> // Load google charts google.charts.load('current', {'packages':['corechart']}); google.charts.setOnLoadCallback(drawChart); // Draw the chart and set the chart values function drawChart() { var data = google.visualization.arrayToDataTable([ ['Task', 'Hours per Day'], ['Work', 8], ['Eat', 2], ['TV', 4], ['Gym', 2], ['Sleep', 8] ]); // Optional; add a title and set the width and height of the chart var options = {'title':'My Average Day', 'width':550, 'height':400}; // Display the chart inside the <div> element with id="piechart" var chart = new google.visualization.PieChart(document.getElementById('piechart')); chart.draw(data, options); document.getElementById('outerdiv').style.display=""; } </script> </body> </html> *Current Code:* <!DOCTYPE html> <html lang="en-US"> <body> <h1>My Web Page</h1> <div id="outerdiv" style="visibility:hidden;"> <div id="piechart"></div> <div> <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js "></script> <script type="text/javascript"> // Load google charts google.charts.load('current', {'packages':['corechart']}); google.charts.setOnLoadCallback(drawChart); // Draw the chart and set the chart values function drawChart() { var data = google.visualization.arrayToDataTable([ ['Task', 'Hours per Day'], ['Work', 8], ['Eat', 2], ['TV', 4], ['Gym', 2], ['Sleep', 8] ]); // Optional; add a title and set the width and height of the chart var options = {'title':'My Average Day', 'width':550, 'height':400}; // Display the chart inside the <div> element with id="piechart" var chart = new google.visualization.PieChart(document.getElementById('piechart')); chart.draw(data, options); document.getElementById('outerdiv').style.visibility=""; } </script> </body> </html> On Wed, Jul 18, 2018 at 6:16 PM Rishabh Kesarwani <rishabh...@gmail.com> wrote: > Thanks for reaching out back. Can you please tell me where have you used > ‘visibility: hidden’? I don’t remember using ‘display: none’ anywhere. > > On Wed, 18 Jul 2018 at 3:39 PM, Vigneshwaran K.M <vigneshwara...@gmail.com> > wrote: > >> Hi Rishab, >> >> I think u r displaying the chart dynamically using "Display:none" like >> me, when I use "Visibility:Hidden" it is working as expected. I am not sure >> why but this trick works >> >> On Fri, Jul 13, 2018 at 7:35 PM Rishabh Kesarwani <rishabh...@gmail.com> >> wrote: >> >>> Hi Vigneshwaran! >>> I couldn’t find any solution. I had to live with it. The bad solution >>> can be to give that element position: relative, top: few px and left: few >>> px. >>> But this won’t be a good solution. >>> >>> On Fri, 13 Jul 2018 at 6:09 PM, Vigneshwaran K.M < >>> vigneshwara...@gmail.com> wrote: >>> >>>> Hi, >>>> >>>> I am also facing the same issue did u find any solution for this? >>>> >>>> >>>> On Thursday, November 23, 2017 at 1:33:24 PM UTC+5:30, Rishabh >>>> Kesarwani wrote: >>>>> >>>>> I'm using the latest version of chrome and google visualization API. >>>>> Still, I'm encountering undesirable pie slice text position. At the least, >>>>> one of the pie slice text goes beyond the boundary of the pie chart. >>>>> Please >>>>> help. >>>>> I've attached the screenshot of the error I'm talking about. >>>>> PFA >>>>> >>>> -- >>>> You received this message because you are subscribed to a topic in the >>>> Google Groups "Google Visualization API" group. >>>> To unsubscribe from this topic, visit >>>> https://groups.google.com/d/topic/google-visualization-api/yDXa_bVEonc/unsubscribe >>>> . >>>> To unsubscribe from this group and all its topics, send an email to >>>> google-visualization-api+unsubscr...@googlegroups.com. >>>> To post to this group, send email to >>>> google-visualization-api@googlegroups.com. >>>> Visit this group at >>>> https://groups.google.com/group/google-visualization-api. >>>> To view this discussion on the web visit >>>> https://groups.google.com/d/msgid/google-visualization-api/2ebd16f9-be97-4dc6-b252-e1593e2304c5%40googlegroups.com >>>> <https://groups.google.com/d/msgid/google-visualization-api/2ebd16f9-be97-4dc6-b252-e1593e2304c5%40googlegroups.com?utm_medium=email&utm_source=footer> >>>> . >>>> For more options, visit https://groups.google.com/d/optout. >>>> >>> -- >>> With regards >>> Rishabh Ranjan Kesarwani >>> >> -- > With regards > Rishabh Ranjan Kesarwani > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsubscr...@googlegroups.com. To post to this group, send email to google-visualization-api@googlegroups.com. Visit this group at https://groups.google.com/group/google-visualization-api. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/CA%2BJg6ypo_osO468Xz5wD4ejJ18qXfzFgChKTEKd%3Dh%2BbKa1511g%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
