Javascript 向每个堆叠条形图项目添加链接

Javascript 向每个堆叠条形图项目添加链接,javascript,highcharts,sharepoint-2013,Javascript,Highcharts,Sharepoint 2013,我有一个堆叠条形图,我正在尝试使图表中单击的每个项目根据单击的内容打开sharepoint视图 我在这里建立数据 seriesData.push({ name: xStatus[i], data: dataArray, url: countArray[i].url }); 我的图表代码如下所示: loadStackedBarChartWithLink = function (xCategories, seriesData, divId, chartTitle, yAxisTitle) {

我有一个堆叠条形图,我正在尝试使图表中单击的每个项目根据单击的内容打开sharepoint视图

我在这里建立数据

seriesData.push({ name: xStatus[i], data: dataArray, url: countArray[i].url });
我的图表代码如下所示:

loadStackedBarChartWithLink = function (xCategories, seriesData, divId, chartTitle, yAxisTitle) {
    //Build Stacked Bar Chart
    $(divId).highcharts({
        chart: {
            type: 'bar'
        },
        credits: {
            enabled: false
        },
        title: {
            text: chartTitle
        },
        xAxis: {
            categories: xCategories,
            allowDecimals: false
        },
        yAxis: {
            min: 0,
            allowDecimals: false,
            title: {
                text: yAxisTitle
            }
        },
        legend: {
            backgroundColor: '#FFFFFF',
            reversed: true
        },
        plotOptions: {
            series: {
                cursor: 'pointer',
                stacking: 'normal',
                point: {
                    events: {
                        click: function () {
                            location.href = this.options.url;
                        }
                    }
                }
            }
        },
        series: seriesData            
    });
}
图表有正确的数据,指针是正确的,但我得到了“未定义”的url

非常感谢您的帮助

IWSChartBuilder.PersonEngagementsByStatusChart = function () {
var load = function () {
    $.when(            
        IWSChartBuilder.RESTQuery.execute(GET THE DATA HERE)
    ).done(
        function (engagements1) {
            var data = [];
            var countArray = [];
            var urls = [];

            var results = engagements1.d.results;                
            for (var i = 0; i < results.length; i++) {
                if (results[i].Consultant.Title == undefined) {
                    continue;
                }
                var found = false;
                for (var j = 0; j < data.length; j++) {
                    if (data[j].personName == results[i].Consultant.Title && data[j].statusName == results[i].Engagement_x0020_Status) {
                        data[j].statusCount = data[j].statusCount + 1;
                        found = true;
                    }
                }
                if (!found) {                        
                    data.push(new IWSChartBuilder.StatusByPerson(results[i].Consultant.Title, results[i].Engagement_x0020_Status, 1));

                }
            }

            //Put data into format for stacked bar chart
            var seriesData = [];
            var xCategories = [];
            var xStatus = [];
            var i, j, cat, stat;

            //Get Categories (Person Name)
            for (i = 0; i < data.length; i++) {
                cat = data[i].personName;
                if (xCategories.indexOf(cat) === -1) {
                    xCategories[xCategories.length] = cat;
                }
            }
            //Get Status values
            for (i = 0; i < data.length; i++) {
                stat = data[i].statusName;
                if (xStatus.indexOf(stat) === -1) {
                    xStatus[xStatus.length] = stat;
                }
            }

            //Create initial series data with 0 values
            for (i = 0; i < xStatus.length; i++) {
                var dataArray = [];
                for (j = 0; j < xCategories.length; j++) {
                    dataArray.push(0);
                }
                seriesData.push({ name: xStatus[i], data: dataArray });
          }

            //Cycle through data to assign counts to the proper location in the series data
            for (i = 0; i < data.length; i++) {
                var personIndex = xCategories.indexOf(data[i].personName);
                for (j = 0; j < seriesData.length; j++) {
                    if(seriesData[j].name == data[i].statusName){
                        seriesData[j].data[personIndex] = data[i].statusCount;                            
                        break;
                    }
                }
            }

            //Build Chart
            IWSChartBuilder.Utilities.loadStackedBarChartWithLink(xCategories, seriesData, "#engagementsByStatusChart", "Engagements by Status", "Total Projects");     
        }
    ).fail(
        function (engagements1) {
            $("#engagementsByStatusChart").html("<strong>An error has occurred.</strong>");
        }
    );
};

return {
    load: load
}

}

您正在连接到点击事件处理程序。在这个处理程序中,“this”指的是点,而不是序列

试试这个:

    plotOptions: {
        series: {
            cursor: 'pointer',
            stacking: 'normal',
            events: {
                    click: function () {
                        location.href = this.options.url;
                    }
            }                
        }
    },

如果需要依赖于点值和序列的URL,则可以同时访问这两个URL。e、 g

plotOptions: {
        series: {
            cursor: 'pointer',
            stacking: 'normal',
            point: {
                events: {
                    click: function () {
                        alert(this.series.options.url + "&y=" + this.y);         
                    }
                }
            }
        }
    },
在本例中,通过使用point.y值添加到UTL,序列上有一个基本URL


您正在连接到点击事件处理程序。在这个处理程序中,“this”指的是点,而不是序列

试试这个:

    plotOptions: {
        series: {
            cursor: 'pointer',
            stacking: 'normal',
            events: {
                    click: function () {
                        location.href = this.options.url;
                    }
            }                
        }
    },

如果需要依赖于点值和序列的URL,则可以同时访问这两个URL。e、 g

plotOptions: {
        series: {
            cursor: 'pointer',
            stacking: 'normal',
            point: {
                events: {
                    click: function () {
                        alert(this.series.options.url + "&y=" + this.y);         
                    }
                }
            }
        }
    },
在本例中,通过使用point.y值添加到UTL,序列上有一个基本URL


您确定countArray[i].url有效吗?您的序列数据是什么样子的?您可以执行
console.log(seriesData)
并查看
url
元素是什么吗?我必须修复url。将它与实际视图进行比较,现在它们匹配了。仍然无法定义是否确定countArray[i]。url有效?序列数据是什么样子的?您可以执行
console.log(seriesData)
并查看
url
元素是什么吗?我必须修复url。将它与实际视图进行比较,现在它们匹配了。仍然没有定义。它应该是this.options.url.Ok现在我至少得到了一个视图,但它与图表上的项目无关。我有其他的图表运行良好,但这个堆叠的图表让我失去了更多的头发。。思想?如果该条没有堆叠,它似乎正在工作。我正在将URL添加到y轴项目(没有显示堆叠的部分)。没用。我现在在另一个变量中有url,我正在将它传递给图表代码。如何使该链接使用我传递的新变量?我将其放入图表代码中,但不起作用:事件:{click:function(){location.href=data.viewUrl;}}我用URL和location.href创建了一个1-dim数组,它将所有URL和location.href与'sUpdated'放在一起。它应该是this.options.url.Ok现在我至少得到了一个视图,但它与图表上的项目无关。我有其他的图表运行良好,但这个堆叠的图表让我失去了更多的头发。。思想?如果该条没有堆叠,它似乎正在工作。我正在将URL添加到y轴项目(没有显示堆叠的部分)。没用。我现在在另一个变量中有url,我正在将它传递给图表代码。如何使该链接使用我传递的新变量?我将其放入图表代码中,但不起作用:事件:{click:function(){location.href=data.viewUrl;}}我用URL和location.href创建了一个1-dim数组,它将所有URL和location.href放在一起,并使用