Highcharts以多个div显示,名称相同

时间:2013-01-02 15:03:03

标签: javascript jquery jquery-mobile highcharts

我对每个函数都有麻烦,我想在不同的div中加载一个具有相同名称的高图,并使用ajax函数重新加载。

我正在阅读一个旧帖子,图表以这种方式加载:

$('.portlet_content_18').each(function(){
var chart = new Highcharts.Chart({
    chart: {
        renderTo: this,
        height: 400
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
    }]
});
}));

这对我有用,但是当我换到ajax电话时却没有。

我的代码使用ajax调用,只在第一个div中加载名为“graphcontainer”的是下一个:

function graph() {
    $(function () {

        $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) {
            // Create the chart
            window.chart = new Highcharts.StockChart({
                chart: {
                    renderTo: 'graphcontainer'
                },
                rangeSelector: {
                    selected: 1
                },

                title: {
                    text: 'AAPL Stock Price'
                },

                series: [{
                    name: 'AAPL',
                    data: data,
                    tooltip: {
                        valueDecimals: 2
                    }
                }]
            });
        });
    });
}

我尝试添加每个函数,以便在其他div中加载而没有结果。 希望你能帮帮我。

1 个答案:

答案 0 :(得分:2)

根据HighChart API和HighStock API

renderTo: String|Object
The HTML element where the chart will be rendered. 
If it is a string, the element by that id is used. 
The HTML element can also be passed by direct reference. Defaults to null.

首先,Highchart需要传递div元素的"id"。所以,我怀疑如何通过你提到的第一个例子来传递类名。

您能否分享一下您从哪里获得前HighChart示例?

其次,你有一个div包含id="graphcontainer"并包含Highstock喜欢

<script src="http://code.highcharts.com/stock/highstock.js"></script>