Javascript 尝试转换数据数组以使用Highcahrts Ajax加载的数据示例

我正在RubyonRails中构建一个仪表板，它使用HighchartsJS创建图表/图形，用于分析google分析数据。我下面介绍Ajax数据实现。他们用于创建线图的csv数据为

目前，我正在使用核心客户端API V3检索google analytics数据，并以

[[Year, Month, Day, Session Hits, Unique Hits], [Year, Month, Day, Session Hits, Unique Hits], [Year, Month, Day, Session Hits, Unique Hits], ...]

一个例子

[["2014", "11", "24", "21","2"], [2014", "11", "25", "8", "0"],["2014", "11", "26", "11", "3"], [2014", "11", "27", "5", "1"]]

我想将这些数据转换成一种形式，就像csv数据Highcharts使用的一样，因为我想要一个与本例完全相同的图形

我试着把它转换成这样

def web_traffic_results
  #Instantiate array of datapoints to be returned for campaign traffic chart
  wt_datapoints = "Day,Visits,Unique Visitors"

  #for each element in ga queried results parse the data into highcharts example format 
  traffic_query.each do |rowContent|
    row_year = rowContent[0]
    row_month = rowContent[1]
    row_day = rowContent[2]
    row_date = "#{row_day}/#{row_month}/#{row_year}"

    total_hits = rowContent[3]
    new_hits = rowContent[4]
    wt_datapoints = wt_datapoints + "\n#{row_date},#{total_hits},#{new_hits}"
  end

  return [wt_datapoints]
end

在我呈现数据的引用中，

[wt\u datapoints]

呈现如下

["Day,Visits,Unique Visitors\n11/04/2014,2,0\n11/13/2014,1,0\n11/20/2014,2,0\n11/21/2014,1,0\n11/24/2014,21,0\n11/25/2014,8,0"]

这里是我调用图表渲染和管道数据的地方

<script>
   $(document).ready(function() {
    WebTrafficChart.render('/mgt/web/<%= @id %>/graphs/traffic', '#web_traffic_chart');
   });
</script>

---

这个实现不起作用，我想知道我是否可以得到一些关于这个问题的帮助和反馈。提前感谢。

您的每个系列都不包含“数据”字段，该字段保留所有分数，因此请注意我的Eli Sebastian，我也对此感到困惑，但我从提供的示例中遵循了它，它有一个

数据：

作为字段，位于

$（选择器）的正下方。highcharts

调用

window.WebCampaignTrafficChart = {
 render: function(data, selector) {
 // Get the CSV and create the chart
 $.getJSON(data, function (csv) {
    // transform
    // {data: []}


    $('#web_traffic_chart').highcharts({

        data: {
            csv: csv
        },

        title: {
            text: 'Total Traffic'
        },

        subtitle: {
            text: 'Source: Google Analytics'
        },

        xAxis: {
            tickInterval: 7 * 24 * 3600 * 1000, // one week
            tickWidth: 0,
            gridLineWidth: 1,
            labels: {
                align: 'left',
                x: 3,
                y: -3
            }
        },

        yAxis: [{ // left y axis
            title: {
                text: null
            },
            labels: {
                align: 'left',
                x: 3,
                y: 16,
                format: '{value:.,0f}'
            },
            showFirstLabel: false
        }, { // right y axis
            linkedTo: 0,
            gridLineWidth: 0,
            opposite: true,
            title: {
                text: null
            },
            labels: {
                align: 'right',
                x: -3,
                y: 16,
                format: '{value:.,0f}'
            },
            showFirstLabel: false
        }],

        legend: {
            align: 'left',
            verticalAlign: 'top',
            y: 20,
            floating: true,
            borderWidth: 0
        },

        tooltip: {
            shared: true,
            crosshairs: true
        },

        plotOptions: {
            series: {
                cursor: 'pointer',
                point: {
                    events: {
                        click: function (e) {
                            hs.htmlExpand(null, {
                                pageOrigin: {
                                    x: e.pageX || e.clientX,
                                    y: e.pageY || e.clientY
                                },
                                headingText: this.series.name,
                                maincontentText: Highcharts.dateFormat('%A, %b %e, %Y', this.x) + ':<br/> ' +
                                    this.y + ' visits',
                                width: 200
                            });
                        }
                    }
                },
                marker: {
                    lineWidth: 1
                }
            }
        },

        series: [{
            name: 'All visits',
            lineWidth: 4,
            marker: {
                radius: 4
            }
        }, {
            name: 'New visitors'
        }]
    });
});

}
}