Диаграмма Google, отображающая нежелательные значения

Question

У меня есть диаграмма Google на моей веб-странице, отображающая значения, вводимые пользователем (результат 1 и результат2).
Я не могу удалить значения [0,0]. Если я это сделаю, диаграмма не будет отображаться, но если я оставлю их, есть точка графика на 0-й точке оси x и y.
мне нужна диаграмма просто построить [result1, result2]

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

function drawChart() { 
    "use strict"; 
    var result1 = document.getElementById('finalScore').value; 
    var result2 = document.getElementById('finalScoreD').value; 

    var data = google.visualization.arrayToDataTable([ 
    ['Quality', 'Delivery'], 
    [ 0, 0], 
    [ 'result1', 'result2'] 
    ]); 

    var options = { 
    title: '', 
    hAxis: {title: 'Quality', minValue: 0, maxValue: 1, gridlines: { count: 3, color: '#000000' }, titleTextStyle: {italic: false}}, 
    vAxis: {title: 'Delivery', minValue: 0, maxValue: 1, gridlines: { count: 3, color: '#000000'}, titleTextStyle: {italic: false}}, 
    width: 370, 
    height: 300, 
    colors: ['#6db33f'], 
    pointSize: 30, 
    pointShape: 'circle', 
    fontName: 'proximaNovaLight', 
    fontSize: '15', 
    backgroundColor: { fill:'transparent' }, 
    legend: 'none', 
    }; 

    var chart = new google.visualization.ScatterChart(document.getElementById('chart_div')); 
} 

Answer 1

есть несколько проблем ...

первая, значение 'result1' и 'result2' используется, а не значение фактического переменной

это
['result1', 'result2']

должно быть
[result1, result2]

следующее, значения входного поля должны быть преобразованы в числа.
вы можете использовать parseFloat
parseFloat(document.getElementById('finalScore').value)

иметь в виду, если что-то другое, чем число вводится, вы можете получить ошибку
использовать isNaN проверить номер

после этих изменений, [0, 0] не требуется

см следующий рабочий фрагмент кода ...

google.charts.load('current', { 
 
    callback: function() { 
 
    "use strict"; 
 

 
    document.getElementById('drawFinalScore').addEventListener('click', drawChart, false); 
 
    drawChart(); 
 

 
    function drawChart() { 
 
     var result1 = parseFloat(document.getElementById('finalScore').value); 
 
     if (isNaN(result1)) { 
 
     result1 = 0; 
 
     } 
 
     var result2 = parseFloat(document.getElementById('finalScoreD').value); 
 
     if (isNaN(result2)) { 
 
     result1 = 0; 
 
     } 
 

 
     var data = google.visualization.arrayToDataTable([ 
 
     ['Quality', 'Delivery'], 
 
     [result1, result2] 
 
     ]); 
 

 
     var options = { 
 
     title: '', 
 
     hAxis: {title: 'Quality', minValue: 0, maxValue: 1, gridlines: { count: 3, color: '#000000' }, titleTextStyle: {italic: false}}, 
 
     vAxis: {title: 'Delivery', minValue: 0, maxValue: 1, gridlines: { count: 3, color: '#000000'}, titleTextStyle: {italic: false}}, 
 
     width: 370, 
 
     height: 300, 
 
     colors: ['#6db33f'], 
 
     pointSize: 30, 
 
     pointShape: 'circle', 
 
     fontName: 'proximaNovaLight', 
 
     fontSize: '15', 
 
     backgroundColor: { fill:'transparent' }, 
 
     legend: 'none', 
 
     }; 
 

 
     var chart = new google.visualization.ScatterChart(document.getElementById('chart_div')); 
 
     chart.draw(data); 
 
    } 
 
    }, 
 
    packages: ['corechart'] 
 
});

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<input id="finalScore" type="text" value="1" /> 
 
<input id="finalScoreD" type="text" value="1" /> 
 
<input id="drawFinalScore" type="button" value="Draw" /> 
 
<div id="chart_div"></div>