javascript - 如何在JavaScript中绘制图形？

我想在Java脚本中绘制图形。让我用简单的例子来分享我的问题。

Ind vs Aus cricket match.
     X axis- Overs
     Y axis- Runs

我想在同一张图中显示两支球队各自得分的成绩。我可以一起展示吗？

您的经验对我很有用。希望获得帮助。

非常感谢您的帮助...在此先感谢，

最佳答案

尝试Google Visualization API:

它包括用于构建数据表的类，然后使用不同类型的图表将其可视化：

Google Visualiation Code Playground中的示例：

function drawVisualization() {
  // Create and populate the data table.
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'x');
  data.addColumn('number', 'Cats');
  data.addColumn('number', 'Blanket 1');
  data.addColumn('number', 'Blanket 2');
  data.addRow(["A", 1, 1, 0.5]);
  data.addRow(["B", 2, 0.5, 1]);
  data.addRow(["C", 4, 1, 0.5]);
  data.addRow(["D", 8, 0.5, 1]);
  data.addRow(["E", 7, 1, 0.5]);
  data.addRow(["F", 7, 0.5, 1]);
  data.addRow(["G", 8, 1, 0.5]);
  data.addRow(["H", 4, 0.5, 1]);
  data.addRow(["I", 2, 1, 0.5]);
  data.addRow(["J", 3.5, 0.5, 1]);
  data.addRow(["K", 3, 1, 0.5]);
  data.addRow(["L", 3.5, 0.5, 1]);
  data.addRow(["M", 1, 1, 0.5]);
  data.addRow(["N", 1, 0.5, 1]);

  // Create and draw the visualization.
  new google.visualization.LineChart(document.getElementById('visualization')).
      draw(data, {curveType: "function",
                  width: 500, height: 400,
                  vAxis: {maxValue: 10}}
          );
}

这将创建您尝试执行的带有X和Y轴的折线图。