0

我有一个包含日期列、RedTeamScore 列和 BlueTeamScore 列的 SharePoint 列表（见屏幕截图）

我的 Highcharts 图表目前由一个系列组成 - RedTeamScore（见截图）

我想从 BlueTeamScore 列向我的图表添加一个附加系列。

下面是我的代码片段

<script type="text/javascript" src="/sites/Test/highcharts/SiteAssets/jquery.min.js"></script>
<script type="text/javascript" src="/sites/Test/highcharts/SiteAssets/SPServices.min.js"></script>
<script type="text/javascript" src="/sites/Test/highcharts/SiteAssets/highcharts.js"></script>
<script type="text/javascript" src="/sites/Test/highcharts/SiteAssets/moment.min.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {

 var yearmontharray = [];
 var valuesarray = [];

 $().SPServices({
  operation: "GetListItems",
  async: false,
  listName: "Scores",
  CAMLViewFields: "<ViewFields><FieldRef Name='Date' /><FieldRef Name='RedTeamScore' /></ViewFields>",
  completefunc: function (xData, Status) {
   $(xData.responseXML).SPFilterNode("z:row").each(function() {
    var yearmonth = ($(this).attr("ows_Date"));
    var values = Math.round($(this).attr("ows_RedTeamScore"));

	var newyearmonth = moment(yearmonth).format("MMM-DD");
	
    yearmontharray.push(newyearmonth);
    valuesarray.push(values);
   });
   var chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'line',
                marginRight: 130,
                marginBottom: 80
            },
            title: {
                text: 'Team Scores',
                x: -20
            },
            subtitle: {
                text: 'Red and Blue Teams',
                x: -20
            },
            xAxis: {
                categories: yearmontharray,
				labels: {
				    rotation: -90
				}
            },
            yAxis: {
                title: {
                    text: 'Score'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'top',
                x: -10,
                y: 100,
                borderWidth: 0
            },
            series: [{
                name: 'RedTeam',
                data: valuesarray
            }]
        });

  }
 });
 
 
  
});
</script>
<div id="container">
</div>

4

1 回答 1

1

您可以将您的系列扩展到：

series: [{
            name: 'RedTeam',
            data: valuesarray
        },{
            name: 'BlueTeam',
            data: valuesarray2
        }]

并导入蓝队数据（3 个新行和 1 个已编辑行）：

...
$(document).ready(function() {

 var yearmontharray = [];
 var valuesarray = [];
 var valuesarray2 = []; //new line

 $().SPServices({
  operation: "GetListItems",
  async: false,
  listName: "Scores",
  CAMLViewFields: "<ViewFields><FieldRef Name='Date' /><FieldRef Name='RedTeamScore' /><FieldRef Name='BlueTeamScore' /></ViewFields>", //edited line
  completefunc: function (xData, Status) {
   $(xData.responseXML).SPFilterNode("z:row").each(function() {
    var yearmonth = ($(this).attr("ows_Date"));
    var values = Math.round($(this).attr("ows_RedTeamScore"));
    var values2 = Math.round($(this).attr("ows_BlueTeamScore")); //new line

    var newyearmonth = moment(yearmonth).format("MMM-DD");

    yearmontharray.push(newyearmonth);
    valuesarray.push(values);
    valuesarray2.push(values2); //new line
   });
...
于 2014-10-14T15:55:34.550 回答