javascript - Highcharts 将 url 添加到柱形图

标签 javascript sharepoint highcharts

我是 Highcharts、Sharepoint 和 JS 的新手。我需要做的是将每个栏链接到 SharePoint View 此代码获取数据

IWSChartBuilder.EngagementsSegmentChart = 函数 () {

var load = function () {
    var year = new Date().getFullYear();
    //Variable to hold counts
    var countArray = [];

    $.when(
        //Consulting Engagements List
        IWSChartBuilder.RESTQuery.execute("valid REST query")
    ).done(
        function (engagements1) {
            var dataArray = [];
            var countArray = [];
            //Get data from Consulting Engagements list
            var results = engagements1.d.results;
            for (var i = 0; i < results.length; i++) {
                for (var i = 0; i < results.length; i++) {
                    dataArray.push(results[i].Segment);
                }
            }

    var baseUrl = "valid url";
            countArray = IWSChartBuilder.Utilities.buildCategoryCountsWithLink(countArray, dataArray, baseUrl);

            //Put data into format for stacked bar chart
            var seriesData = [];
            var xCategories = [];
            var links = [];
            for (var i = 0; i < countArray.length; i++) {
                xCategories.push(countArray[i].name);
                seriesData.push(countArray[i].y);
                links.push(countArray[i].url);
            }
            //Build Chart
            IWSChartBuilder.Utilities.loadColumnChartWithLink(links, xCategories, seriesData, "#engagementSegmentChart", "Engagements by Segment", "Total Projects");
        }
    ).fail(
        function (engagements1) {
            $("#engagementSegmentChart").html("<strong>An error has occurred.</strong>");
        }
    );
};

return {
    load: load
}
}();

//显示图表的代码

loadColumnChartWithLink = function (xCategories, seriesData, divId, chartTitle, yAxisTitle) {
    //Build Column Chart
    $(divId).highcharts({
        chart: {
            type: 'column'
        },
        credits: {
            enabled: false
        },
        title: {
            text: chartTitle
        },
        xAxis: {
            categories: xCategories,
            allowDecimals: false,
            labels: {
                rotation: -45,
                align: 'right'
            }
        },
        yAxis: {
            min: 0,
            allowDecimals: false,
            title: {
                text: yAxisTitle
            }
        },
        legend: {
            enabled: false
        },
        plotOptions: {
            bar: {
                dataLabels: {
                    enabled: false
                }
            },
            series: {
                cursor: 'pointer',
                point: {
                    events: {
                        click: function() {
                            location.href = this.options.url;
                        }
                    }
                }
            }
        },
        series: [{
            name: yAxisTitle,
            data: seriesData
        }]
    });
},

非常感谢任何帮助 标记

最佳答案

您需要调整数据以将对象创建为点,如示例所示:

{y:10,url:'http://google.com'}

然后捕获serie点上的点击事件。

http://jsfiddle.net/2tL5T/

关于javascript - Highcharts 将 url 添加到柱形图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20353521/

相关文章:

javascript - javascript测试中的异步断言

javascript - 如何避免无用的else block 语句来增加单元测试用例中的分支覆盖率?

SharePoint 网站集 : relation with DB WSS_Content

reactjs - 如何从'office-ui-fabric-react导入自动绑定(bind)?

javascript - Highcharts:在图例中显示堆叠图表的最后一个值

javascript - 没有 jQuery 和 JSPM 的 highcharts

javascript - 使用 ng-repeat 生成表体行

javascript - 我的JSON文件格式正确吗?

javascript - 从长字符串中提取

javascript - HighCharts + xAxis 标签格式化程序