将数据发送到HighCharts

时间:2016-01-30 10:21:44

标签: javascript highcharts

我需要遍历数据,在变量中抓取它然后将其发送到HighCharts

但我无法做到 有人可以帮忙吗?

这是我的代码:

$.ajax({
  type: "POST",
  url: "/",
  data : { 'perfid': valueOne, 'hostname': $("#host").val(), 'iteration': valueThree},
  success: function(data) {
    $('#img1').hide();

   var obj = data[$("#host").val()].iscsi_lif.result.sectoutput.sect;

    for(var key in obj) {

            var avg_latency = parseInt(obj[key].avg_latency);
            i++;
            console.log(avg_latency);           
    }


    $('#graphcontainer2').highcharts({
    chart: {
        type: 'column'
    },
    title: {
        text: 'Write Latencies'
    },
    xAxis: {
        type: 'category',
        labels: {
            rotation: -45,
            style: {
                fontSize: '13px',
                fontFamily: 'Verdana, sans-serif'
            }
        }
    },
    yAxis: {
        min: 0,
        title: {
            text: 'Write Latencies(us)'
        }
    },
    legend: {
        enabled: false
    },
    tooltip: {
        pointFormat: 'Write Latencies: <b>{point.y:.1f}%</b>'
    },
    series: [{
        name: 'Write latency',
        data: [ 
                ['Average Latency', parseInt(avg_latency)],
              ],
        dataLabels: {
            enabled: true,
            rotation: -90,
            color: '#FFFFFF',
            align: 'right',
            format: '{point.y:.1f}', // one decimal
            y: 10, // 10 pixels down from the top
            style: {
                fontSize: '13px',
                fontFamily: 'Verdana, sans-serif'
            }
        }
    }]
});

以下是avg_latency控制台值的屏幕截图: enter image description here

我想显示所有avg_latencies的图表。 有人可以指出我在这段代码中做错了什么。 感谢。

1 个答案:

答案 0 :(得分:1)

您应该将字典中的数据列表传递给highchart系列,试试这个:

$.ajax({
  type: "POST",
  url: "/",
  data : { 'perfid': valueOne, 'hostname': $("#host").val(), 'iteration': valueThree},
  success: function(data) {
    $('#img1').hide();

   var obj = data[$("#host").val()].iscsi_lif.result.sectoutput.sect;
    var my_data_list = [];
    for(var key in obj) {
            var avg_latency = parseInt(obj[key].avg_latency);
            my_data_list.push({name: 'Average Latency', y: parseInt(avg_latency)});
            console.log(avg_latency);           
    }


    $('#graphcontainer2').highcharts({
    chart: {
        type: 'column'
    },
    title: {
        text: 'Write Latencies'
    },
    xAxis: {
        type: 'category',
        labels: {
            rotation: -45,
            style: {
                fontSize: '13px',
                fontFamily: 'Verdana, sans-serif'
            }
        }
    },
    yAxis: {
        min: 0,
        title: {
            text: 'Write Latencies(us)'
        }
    },
    legend: {
        enabled: false
    },
    tooltip: {
        pointFormat: 'Write Latencies: <b>{point.y:.1f}%</b>'
    },
    series: [{
        name: 'Write latency',
        data: my_data_list,
        dataLabels: {
            enabled: true,
            rotation: -90,
            color: '#FFFFFF',
            align: 'right',
            format: '{point.y:.1f}', // one decimal
            y: 10, // 10 pixels down from the top
            style: {
                fontSize: '13px',
                fontFamily: 'Verdana, sans-serif'
            }
        }
    }]
});