javascript - Google Visualization Chartwrapper 选择图表元素

Question

选中时我似乎无法获取饼图切片的值。这是我的代码:

var pieChart = new google.visualization.ChartWrapper( {
    chartType: 'PieChart',
    containerId: 'chart_div',
    dataTable: saleTypes,
    options: { 
        title: 'Types of Sale',
        titleTextStyle: {
            fontSize: 18
        },
        width: 300,
        height: 300,
        chartArea: { width: '100%', height: '75%' },
        legend: {
            position: 'bottom'
        }
    }
} );

google.visualization.events.addListener( pieChart, 'ready', onReady );

function selectHandler() {
    var selectedItem = pieChart.getChart().getSelection()[0];
    if ( selectedItem ) {
        var value = data.getValue(selectedItem.row, selectedItem.column);
        alert('The user selected ' + value);
    }
}

function onReady() {
   google.visualization.events.addListener( pieChart.getChart(), 'select', selectHandler );
}

pieChartViolationTypes.draw();

我收到以下错误:

Uncaught Error :未定义的无效行索引。应该在 [0-112] 范围内

Answer 1

尝试使用图表的数据表访问选择处理程序中的值...

pieChart.getDataTable().getValue(selectedItem.row, 1);

不确定 data 的定义位置，但如果图表绑定(bind)到过滤器，
然后需要使用图表正在使用的当前数据...

function selectHandler() {
    var selectedItem = pieChart.getChart().getSelection()[0];
    if ( selectedItem ) {
        var value = pieChart.getDataTable().getValue(selectedItem.row, 1);
        alert('The user selected ' + value);
    }
}

注意:饼图可能只有一个系列列，并且在 getSelection 中为列索引返回 null

编辑

如果 View 也应用在图表上，
使用选择从 view.rows

获取行索引

pieChart.getView().rows[selectedItem.row]

var value = pieChart.getDataTable().getValue(pieChart.getView().rows[selectedItem.row], 1);