javascriptchartsgoogle-visualizationpie-chartgoogle-pie-chart

Google Pie Chart pointing line between legend and pie chart


I would like to add a line to connect the pie chart to the label so the user can see what is the legend for the particular part of pie chart. these are the codes i use to generate my piechart

function drawVisualizationIamIn(dataValues) {
    console.log(dataValues)
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Column Name');
    data.addColumn('number', 'Column Value');
    for (var i = 0; i < dataValues.length; i++) {
        data.addRow([dataValues[i].ColumnName, dataValues[i].Value]);
    }
    new google.visualization.PieChart(
        document.getElementById('visualizationIamIn')
    ).draw(data, {
        title: "Members by Industry Type",
        sliceVisibilityThreshold: 0,
        backgroundColor: '#e0e7eb'
    });
}

Any help is appreciated, thank you. below is the chart i generate with codes above.

enter image description here


Solution

  • use the following option...

    {
      legend: {
        position: 'labeled'
      }
    }