CODEWITHSUNDEEP
javascripthtmlgoogle-visualizationpie-chartgoogle-pie-chart
Rasec219
Rasec219

Reputation: 23

Change stroke width to 2 on a google pie chart

Am trying to make a chart with the google pie chart but the stroke-width of thye slices are to thin and im trying to make them thicker.

the code bellow is what i am using but unfortunately it isnt working. 

google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);

function drawChart() {
  var data = google.visualization.arrayToDataTable([
  ['Sitio', 'Dinheiro'],
  ['Restaurantes', 8],
  ['Bares', 2], 
  ['Discotecas', 7]
]);

  // Optional; add a title and set the width and height of the chart
    var options = {

        width: '92%',
        height: 550,
        color: 'white',

        backgroundColor: '#232220',

        chartArea: { top: '3%', width: '70%', height: '80%' },
        slice: {
            backgroundColor: {strokeWidth:2}
        },
        legend: { position: 'bottom', textStyle: { color: 'white', fontSize: 16 } },
        
        pieSliceBorderColor : "tranparent"
        };

  // Display the chart inside the <div> element with id="piechart"
  var chart = new google.visualization.PieChart(document.getElementById('piechart'));
  chart.draw(data, options);
}
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="piechart" style="height: 370px; width: 92%;"></div>

have searched around but its always about the color and not the width of the slices width so i wasnt able to change it

Upvotes: 0

Views: 1735

Answers (1)

Josh H
Josh H

Reputation: 274

Looking through the configuration options for the google pie chart there is no option to set the stoke width of the slices.

You can however set the stroke width using css:

    <style type="text/css">
        path {
          stroke-width: 2;
        }
    </style>

Upvotes: 3

Related Questions