This problem of misaligned labels in the PieChart is typically due to drawing the chart when it is not visible. Maybe just move your div to before the script. It might also help to move the loader.js script tag to the header of your document.
On Sunday, October 17, 2021 at 12:23:47 AM UTC-4 kiwis wrote: > Also blue bar only covers blue section, or black bar isn't on black > section? > > Any help? > > <script type="text/javascript" src=" > https://www.gstatic.com/charts/loader.js";></script> > <script type="text/javascript"> > google.charts.load("current", > {packages:["corechart"]}); > google.charts.setOnLoadCallback(drawChart); > > function drawChart() { > var data = > google.visualization.arrayToDataTable([ > ['Task', 'Wins'], > ['Canterbury', 21], > ['Auckland', 7], > ['Draw', 0] > ]); > > var options = { > title: 'Head to Head Winning Reocrd', > pieHole: 0.1, > colors: ['#007bff', '#000', '#FFF'], > legend: > {'position':'right','alignment':'center'}, > }; > > var chart = new > google.visualization.PieChart(document.getElementById('piechart')); > chart.draw(data, options); > } > </script> > <div id="piechart"></div> > > [image: chart.PNG] -- 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 [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/5e14d766-b2c0-4455-ace5-fc0895031d1en%40googlegroups.com.
