Google折线图绘制问题

user7220615 发表于 Dev

用户名

在程序中计算出的权重需要显示在图表中。我在代码中添加了一个示例，摘自此处：https : //developers.google.com/chart/interactive/docs/gallery/linechart#creating-material-line-charts显然，变量数据需要替换为权重，因此可以丢弃现有数据（第17至31行）。随附最新版本的代码

 <html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', { 'packages': ['line'] });  // load the visualisation API and corechart package
google.charts.setOnLoadCallback(drawChart);               // set a callback to run when the Google Visualization API is loaded

// Callback that creates and populates a data table, instantiates the chart, passes in the data and draws it.
function drawChart() {
  // Create the data table for the symbol in question.
  var data = new google.visualization.DataTable();
  data.addColumn('number', 'k');
  data.addColumn('number', 'lambda');

  data.addRows([
    [-0.050, 0.00952],
    [-0.040, 0.00952],
    [-0.030, 0.01904],
    [-0.025, 0.03809],
    [-0.020, 0.02857],
    [-0.015, 0.04761],
    [-0.010, 0.02857],
    [-0.005, 0.18095],
    [0.000, 0.21904],
    [0.005, 0.16190],
    [0.010, 0.12380],
    [0.015, 0.05714],
    [0.020, 0.03809],
    [0.030, 0.02857],
    [0.080, 0.00952]
  ]);

  var chart = new google.charts.Line(document.getElementById('#chart_weights'));
  chart.draw(data, { height: 288, width: 550, lineWidth: 1 });
}
</script>
</head>

<body>
<table>
<tr><td>k: </td><td><input id="k" type="number" value="2.2" min="0" max="10" step="0.1" /></td></tr>
<tr><td>lambda: </td><td><input id="lambda" type="number" value="7.6" min="0" max="10" step="0.1" /></td></tr>
</table>

<p id="message"> </p>

<script type="text/javascript">
UpdateValues();

document.getElementById("k").addEventListener("click", function() {
  UpdateValues();
});

document.getElementById("lambda").addEventListener("click", function() {
  UpdateValues();
});

function UpdateValues() {
  var weight = [];
  var k = document.getElementById("k").value;
  var lambda = document.getElementById("lambda").value;
  for (var x = 0.1; x < 20; x++) {
    weight.push([x, k * Math.pow(x/lambda, k-1) * Math.exp(-Math.pow(x/lambda, k)) / lambda]);
    document.getElementById("message").innerHTML = weight;
  }
}
</script>
<div id="chart_weights"></div>
</body>
</html>

我不知道为什么不显示这些图表。

奥列克桑德·萨夫琴科（Oleksandr Savchenko）

请检查这个例子

因此，主要问题是Container is not defined。

在你的代码写的document.getElementById('#chart_weights')，但你应该写document.getElementById('chart_weights')没有#。

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。