如何使用数组从 google 制作散点图？

Question

由于数组的“类型”，我在创建图表时遇到了一些问题，例如在 var data = ... 他们使用 [12, 30], [14, 98] 的示例中，但我想使用定义如下的数组我在代码中有这些值，但我不知道该怎么做。

$(document).ready(function() {
  console.log("ready!");

  ko.applyBindings(new vm());

  var k = 0;
  var Arraydata1 = [];
  var Arraydata2 = [];

  console.log(indice)
  $.ajax({
    url: 'http://192.168.160.58/Formula1/api/Statistics/Driver?id=' + indice,
    contentType: "application/json",
    dataType: 'json',
    success: function(data) {
      for (k = 0; k < data.Career.length; k++) {

        Arraydata1.push(data.Career[k].Year);
        Arraydata2.push(data.Career[k].Position);

      }
      drawChart(Arraydata1, Arraydata2)
    },
  });

});

function drawChart(Arraydata1, Arraydata2) {
  var data = google.visualization.arrayToDataTable([
    ['Price', 'Size'],
    // dont know what to put here
  ]);
  // Set Options
  var options = {
    title: 'House Prices vs. Size',
    hAxis: {
      title: 'Square Meters'
    },
    vAxis: {
      title: 'Price in Millions'
    },
    legend: 'none'
  };
  // Draw
  var chart = new google.visualization.ScatterChart(document.getElementById('myChart'));
  chart.draw(data, options);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

Answer 1

将 Career 中的行值合并到一个数组中 -- Arraydata

Arraydata.push([data.Career[k].Year, data.Career[k].Position]);

传递那个数组来绘制图表

drawChart(Arraydata);

然后用必要的列标题创建数据table，
并使用 addRows 方法。

// create data table
var data = new google.visualization.DataTable();
data.addColumn('number', 'Price');
data.addColumn('number', 'Size');
data.addRows(Arraydata);

请参阅以下代码片段...

$(document).ready(function() {
  console.log("ready!");

  ko.applyBindings(new vm());

  var k = 0;
  var Arraydata = [];

  console.log(indice)
  $.ajax({
    url: 'http://192.168.160.58/Formula1/api/Statistics/Driver?id=' + indice,
    contentType: "application/json",
    dataType: 'json',
    success: function(data) {
      for (k = 0; k < data.Career.length; k++) {

        Arraydata.push([data.Career[k].Year, data.Career[k].Position]);

      }
      drawChart(Arraydata);
    },
  });

});

function drawChart(Arraydata) {
  // create data table
  var data = new google.visualization.DataTable();
  data.addColumn('number', 'Price');
  data.addColumn('number', 'Size');
  data.addRows(Arraydata);

  // Set Options
  var options = {
    title: 'House Prices vs. Size',
    hAxis: {
      title: 'Square Meters'
    },
    vAxis: {
      title: 'Price in Millions'
    },
    legend: 'none'
  };
  // Draw
  var chart = new google.visualization.ScatterChart(document.getElementById('myChart'));
  chart.draw(data, options);
}

如何使用数组从 google 制作散点图？

How can I use a Array to make a scatter chart from google?

jquery

charts

google-visualization