Google Charts Pie Chart Event

Question

Google Charts Pie Chart Event

1

У меня есть следующий код для создания нескольких круговых диаграмм на моей странице:

for(var question in questions){
    console.log(question);
    var curChart = $('<div class="summary-chart"></div>');
    curChart.appendTo(contentDiv);
    var data = [["answer_text", "quantity"]];
    for(var answer in questions[question]){
        data.push([answer, questions[question][answer]]);
    }
    var data = google.visualization.arrayToDataTable(data);
    chart = new google.visualization.PieChart(curChart[0]);
    google.visualization.events.addListener(chart, 'select', function(){
        alert(this.getSelection().focusNode.data); //alert slice text
    });
    chart.draw(data, {title: question, pieHole: 0.3, pieSlieceText: 'percentage', backgroundColor: '#efefef'});
}

Как вы можете видеть, когда я нажимаю на фрагмент, он печатает текст этого фрагмента. Мне нужно установить идентификатор в таблице и получить этот идентификатор внутри события (где у меня есть alert(this.getSelection().focusNode.data)).

Я мог бы, конечно, включить id в внешний div, как:

var curChart = $('<div class="summary-chart" data-id="'+question+'"'></div>');

Теперь мне просто нужно выяснить, как добраться до этих данных в оповещении.

ajon 23 окт. 2017, в 22:29

Источник

0

Когда я делаю этот вопрос, это значение последнего вопроса для всех графиков.
ajon 24 окт. 2017, в 04:55

Теги:

javascript

charts

google-visualization

1 ответ

Ещё вопросы

Когда я делаю этот вопрос, это значение последнего вопроса для всех графиков.

WhiteHat · Accepted Answer · 2017-10-24T08-37-00.000Z

для предотвращения блокировки значения question для последнего значения внутри прослушивателя событий,
назначить событие в закрытии (функции)

for(var question in questions) {
    if (questions.hasOwnProperty(question)) {
        drawQuestion(question);
    }
}

function drawQuestion(question) {
    var curChart = $('<div class="summary-chart"></div>');
    curChart.appendTo(contentDiv);
    var data = [["answer_text", "quantity"]];
    for(var answer in questions[question]){
        data.push([answer, questions[question][answer]]);
    }
    var data = google.visualization.arrayToDataTable(data);
    chart = new google.visualization.PieChart(curChart[0]);
    google.visualization.events.addListener(chart, 'select', function(){
        console.log(question, this.getSelection().focusNode.data);
    });
    chart.draw(data, {title: question, pieHole: 0.3, pieSlieceText: 'percentage', backgroundColor: '#efefef'});
}

Круто, спасибо большое. Я закончил тем, что addListener вызов addListener вниз в его собственную функцию, оставшуюся без изменений.