Question

我目前有一个图表从本地JSON文件中提取数据。我现在需要通过表单提交数据以动态更新图表。我知道Highcharts有一个addPoint方法应该可以工作，只需要一些关于如何将表单数据传递给这个方法的指导。

  <form id="add_data">
    <p>
      <input type="date" name="date" id="human" value="date" />
    </p>
    <p>
      <input type="integer" name="amount" id="amount" value="amount" />
    </p>
    <p>
      <input type="radio" name="request_type" id="human" value="human" />
      <label for="human">Human</label>
    </p>
    <p>
      <input type="radio" name="request_type" id="good" value="good" />
      <label for="good">Good</label>
    </p>
    <p>
      <input type="radio" name="request_type" id="bad" value="bad" />
      <label for="bad">Bad</label>
    </p>
    <p>
      <input type="radio" name="request_type" id="whitelist" value="whitelist" />
      <label for="whitelist">Whitelist</label>
    </p>
    <input id="submit" type="submit" value="Submit">
  </form>

Highcharts文档使用此作为示例，这是我尝试使用的，但不是硬编码我需要传递给表单数据的数据。我想......如果我完全离开，请告诉我。任何帮助表示赞赏。

$('#add_data   input:radio[name=request_type]').click(function() {
  $index = $('#add_data input:radio[name=request_type]').index(this);
});

$('#submit').click(function() {
  var chart = $('#container').highcharts(),
    amount = parseFloat($('#amount').val());
  chart.series[$index].addPoint(amount);
});

Answer 1

在点击操作中，您需要从输入中提取值。例如，如果您需要从输入AMOUNT添加带有值的点，则应使用它：

$('#submit').click(function() {
    var chart = $('#container').highcharts(),
        point = parseFloat($('#amount').val());

    chart.series[0].addPoint(point);
    i += 1;
});

将表单数据提交到Highcharts addPoint方法以动态更新表单

1 个答案: