CODEWITHSUNDEEP
javascripthtmlgoogle-mapsgoogle-visualization
Michael Gruber
Michael Gruber

Reputation: 601

Google GeoChart onclick setCell not working

I'm having difficulty highlighting countries with the Google GeoCharts API and a checkbox's onclick.

My displaymarkers function should use the setCell function by passing the input value as the DataTable's row index.

However passing the check.value to setCell doesn't seem to work. If I simply put data.setCell(1, 1, 1); it works perfectly.

How should I go about doing this short of making a lot of if statements?

Javascript:

var data;
var chart;
var options;

function drawRegionsMap() {
    data = google.visualization.arrayToDataTable([
        ['Country', 'Popularity'],
        ['United States', 1],
        ['RU', 1]
    ]);

    options = {legend: 'none'};

    chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
    chart.draw(data, options);
};

function displaymarkers(check) {
    // Checkbox has been checked
    if (check.checked) {
        data.setCell(check.value, 1, 1);
    } else { // Checkbox has been unchecked
        data.setCell(check.value, 1, 0);
    }

    chart.draw(data, options);
}

HTML:

<input type="checkbox" name="us" onclick="displaymarkers(this)" value="0" checked="checked" />US
<input type="checkbox" name="russia" onclick="displaymarkers(this)" value="1" checked="checked" />Russia

Upvotes: 0

Views: 489

Answers (1)

Michael Gruber
Michael Gruber

Reputation: 601

check.value returns a string. parseInt(check.value) works.

Upvotes: 1

Related Questions