我有一个 Pandas 数据框，我已经像这样转换为 JSON:

json_data = data_df.to_json()

原始数据框看起来与此类似:

    col1  col2  col3  col4 
0     1     2     2    -1 
1     2     4     3    -2 
2     3     6     4    -3 
3     4     8     5    -4 
4     5     10    6    -5 
...

JSON 字符串看起来类似于:

[{"col1":1,"col2":2,"col3":2,"col4":-1},{"col1":2,"col2":4,"col3":3,"col4":-2},{"col1":3,"col2":6,"col3":4,"col4":-3},{"col1":4,"col2":8,"col3":5,"col4":-4}]

我的Highcharts实现如下:

$(document).ready(function() { 
 
    var my_data = '{{ json_data }}' 
             
    // create data chart 
    $('#container').highcharts({ 
        chart: { 
            renderTo: 'chart_panel', 
            type: 'line', 
        }, 
        legend: {layout: 'vertical', 
                 align: 'right', 
                 verticalAlign: 'middle', 
                 borderWidth: 0, 
        }, 
        title: {text: 'Roehrig Damper Data', 
                x: -20 // center title 
        }, 
        xAxis: {title: {text: 'Velocity (m/sec)'}}, 
        yAxis: {title: {text: 'Force (N)'}}, 
        series: [ {data: my_data} ], 
    }); 
 
});

{{ json_data }} 来 self 的 Django python View ，我已经通过浏览器控制台确认它的格式正确。目前我的代码只显示一个空白的 Highcharts 图表，其中填充了零数据。我尝试了几种不同的方法来操纵我想要的数据，但没有成功。

我的目标是根据 col1 绘制 col2 并在同一图表上绘制 col4 与 col3，或者换句话说，x 轴将由 col1 和 col3 定义。

有没有办法实现我的上述目标，如果有，怎么做？

编辑

在@Andrew_Lvov 的帮助下，我现在有一个如下所示的 JSON 对象:

json_data = [ 
    { 
        'name': "col1", 
        'data': array([1, 2, 3, 4, 5])}, 
    { 
        'name': "col2", 
        'data': array([2, 4, 6, 8, 10])}, 
    // etc. 
]

现在我的问题是它正在向数据中添加单词 array。

请您参考如下方法:

尝试

var myData = {{ json_data | safe }};

更新:

您的数据应采用以下格式:

json_data = [ 
    { 
        'name': "col1", 
        'data': [1, 2, 3, 4, 5]}, 
    { 
        'name': "col2", 
        'data': [2, 4, 6, 8, 10]}, 
]

系列参数:

        series: myData

更新#2:

json_data = [{'data': list(value.values), 'name': key} for key, value in data_df.items()]

python之在 Django 模板中为 Highcharts 从 Pandas 数据帧格式化 JSON

编辑