柱形图的动态数据

时间:2016-05-31 11:05:14

标签: jquery highcharts

我无法推送我的专栏的动态数据

API和所有准备好的,不知道如何将正确的数据输入图表, 下面是代码,

     function aoassortmentsdata() {
        var data = [
            {
                name: "Sales",
                data: [200, 120, 165, 170, 100],
                color: "#60B3D1"
            }
        ]
        return data;
    }
function LoadStep6()
{
    var getAjaxData = processAjaxCall(urlGetClusterGraphData, JSON.stringify({ ID: projectId }), 'POST', function (status, successcode, data) { });
    if (getAjaxData.Data != 'Error') {
        LoadAssortmentGraph(getAjaxData.Data);
    }
}
    function LoadAssortmentGraph(data) {

        var xDates = [], Sales = [];
        for (var i = 0; i < data.length; i++) {
            xDates.push(data[i].ProjectedRevenue);
            Sales.push(data[i].LocalizationLift);
        }

        var chart = $('#ao-assortments-container').highcharts();

        chart.xAxis[0].setCategories('', true, true);
        chart.series[0].setData('');

        chart.xAxis[0].setCategories(Sales, true, true);
        chart.series[0].setData(xDates);
    }

    function IntiGraph() {
        $('#ao-assortments-container').highcharts({
            chart: {
                type: 'column',
                inverted: true,
                verticalAlign: "center",
                plotBackgroundColor: '#F7F7F7',
                plotBorderColor: "60B3D1"
            },
            credits: { enabled: false },
            title: null,


            xAxis: {
                alternateGridColor: '#fff',
                offset: 120,
                //categories: ["5 CLUSTERS", "4 CLUSTERS", "3 CLUSTERS", "2 CLUSTERS", "1 CLUSTER"],
                tickWidth: 0,
                lineWidth: 0,
                min: 0,
                max: 4,
                labels: {
                    enabled: true,
                    useHTML: true,
                    x: 100,
                    verticalAlign: "middle",
                    align: "right",
                    formatter: function () {
                        return '<div class="ao-clusters-labels"><input type="radio" class="ao-assortment-radio" size="10" name="assortmentClusterValue"/><span class="ao-assortment-clustertitle">' + this.value + ' CLUSTER</span></div>';
                    }
                }
            },
            yAxis: {
                min: 0,
                max: 250,
                tickInterval: 50,
                title: null,
                gridLineColor: '#ede9e9'
            },
            legend: {
                enabled: true,
                layout: 'horizontal',
                align: 'bottom',
                width: 75,
                x: 30,
                y: 0,
                symbolHeight: "0",
                borderWidth: "0",
                useHTML: true,
                labelFormatter: function () {

                    return '<div class="ao-assortment-title"><span class="ao-assortment-legend-shape">&nbsp;</span> Sales </div>';
                }
            },
            tooltip: {
                valuePrefix: "$"
            },

            plotOptions: {
                series: {

                    pointWidth: 31,
                    allowPointSelect: false,
                    marginLeft: 50,
                    dataLabels: {
                        align: 'center',
                        enabled: true,
                        useHTML: true,
                        x: -30,
                        formatter: function () {
                            return "$ " + this.y;
                        },
                        style: {
                            fontWeight: "normal",
                            textAlign: "center",
                            color: "#fff"
                        }
                    }
                }

            },
            series: aoassortmentsdata()

        });
    };

使用静态数据工作JsFiddle:LINK

请让我知道我在哪里犯了错误或如何解决这个问题? 帮助升值!提前谢谢!!

0 个答案:

没有答案