0

这是我的第一个HighCharts项目,在显示使用SPservices获取的数据时遇到了一些问题。我找到了本教程(SharePoint to Highcharts),它有很大帮助,但我在显示图表中的列名和图例时遇到问题,它只显示“切片”这是我的 javascript:

$(document).ready(function() {

var namesArray = [];
var valuesArray = [];
$().SPServices({
    operation: "GetListItems",
    async: false,
    listName: "Test",
   CAMLQuery: "<Query><OrderBy><FieldRef Name='Person'/></OrderBy></Query>",
   CAMLViewFields: "<ViewFields><FieldRef Name='Person' /><FieldRef Name='Age' /><FieldRef Name='Earnings' /><FieldRef Name='Names' /></ViewFields>",
completefunc: function (xData, Status) {
$(xData.responseXML).SPFilterNode("z:row").each(function() {
var names = $(this).attr("ows_Names");
var values = Math.round($(this).attr("ows_Earnings"));
namesArray.push(names);
valuesArray.push(values);

});  } });  
chart = new Highcharts.Chart({
           chart: {
            renderTo: 'container',
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false
        },
        title: {
            text: 'Total values',
            x: -20, //center
             },

   plotOptions:{ pie: {
allowPointSelect: true,
showInLegend: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: $'+ this.y;} }, }},

        subtitle: {
            text: 'This chart shows value from a SharePoint list using SPServices',
            x: -20
        },

   tooltip:{shared: true,pointFormat: '{series.name}: <b>{point.values}$</b>{point.y}',valueDecimals: 2,shared: true,
        useHTML: true,},


        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'top',
            x: -300,
            y: 100,
            borderWidth: 0
        },
        series: [{
         showInLegend:true,
        type: 'pie',
            name: 'Earnings',
            data: valuesArray
        }]
    });});  

这是我在浏览器中看到的:

在此处输入图像描述

提前感谢您的任何建议。

4

1 回答 1

1

您必须在系列数据数组中提供切片名称。试试这个方法

completefunc: function (xData, Status) {
    $(xData.responseXML).SPFilterNode("z:row").each(function() {
        var names = $(this).attr("ows_Names");
        var values = Math.round($(this).attr("ows_Earnings"));
        //namesArray.push(names); <-- YOU DON'T NEED THIS
        valuesArray.push([names,values]);
    });  
});  

更多解释参见下面的小提琴
http://jsfiddle.net/krishanudey/XzZa4/1/
如果你看到这个系列的数据,你会看到,在没有提供切片名称的地方,它的名字为Slice

于 2014-06-03T16:15:15.440 回答