编辑图表后,在HighChart上更新系列阵列

时间:2013-03-17 16:51:34

标签: javascript jquery ajax csv highcharts

我是JavaScript和Web开发的新手。我有一个areapline高图,作为项目的一部分,我必须能够通过在y轴上向上或向下移动曲线上的点来编辑图表。我已经从保存在服务器上的csv文件中的数据创建了图表。我的想法是,我可以编辑曲线上的点,然后更新csvfile,稍后我可以使用它创建一个单独的图形。

我按照这个例子来实现点拖动:http://jsfiddle.net/highcharts/AyUbx/正在运行。

我遇到的问题是在编辑图表后更新了csv文件。我一直在寻找问题的解决方案,但我似乎无法弄明白。 这是jsfiddle示例中的函数,其中包含我需要回发到服务器并写入csv文件的值:

    drop: function() {
    $('#drop').html(
    'In <b>' + this.series.name + '</b>, <b>' +
    this.category + '</b> was set to <b>' + 
    Highcharts.numberFormat(this.y, 2) + '</b>'
    );
    }`

如何使用新值(this.y)更新服务器上的csv文件?

由于

1 个答案:

答案 0 :(得分:2)

如果要将数据发布到服务器,可以使用jquery post方法:

drop: function() {
    $('#drop').html(
    'In <b>' + this.series.name + '</b>, <b>' +
    this.category + '</b> was set to <b>' + 
    Highcharts.numberFormat(this.y, 2) + '</b>'
    );
    $.post("updateFile.php", { ypos: this.y , xpos: this.x} );  // like this
}`

<强>更新

之后,您只需在updateFile.php页面中更新您的文件。您可以使用PHP访问您的数据,例如$_POST['ypos']$_POST['xpos']

例如,如果要在CSV文件中写入新位置:

<?php
// 1 : open the file
$myfile = fopen('myfile.csv', 'a+');

// 2 : write at the end of the file
fputs($myfile, $_POST['ypos'] . "; " . $_POST['xpos'] . "\n");

// 3 : when we have done, we close the file
fclose($myfile);
?>