将HighCharts渲染为类而不是id？

I have the following which works fine:

我有以下工作正常：

$(document).ready(function() {

    get_data_for_chart();

    function get_data_for_chart() {
        $.ajax({
            url: 'get_data.aspx?rand=' + Math.random(),
            type: 'GET',
            dataType: 'json',
            error: function(xhr, status, error) {
                console.log(status);
                console.log(xhr.responseText);
            },
            success: function(results) { 
                var chart1;

                chart1 = new Highcharts.Chart( {
                    chart: {
                        renderTo: 'portlet_content_18',
                        defaultSeriesType: 'column'
                    }
                });

            }
        });
    }
});

Where the HTML looks something like this:

HTML看起来像这样：

<div id="portlet_content_18">

The user can dynamically select which portlet s/he wants on screen. S/He can also select to have the same portlet on the screen more than once for comparison reasons.

用户可以在屏幕上动态选择他/她想要的portlet。出于比较原因，他/她还可以选择在屏幕上多次使用相同的portlet。

So if the HTML ends up becoming:

因此，如果HTML最终成为：

<div id="portlet_content_18">
<div id="portlet_content_18">

Only the first div gets populated with the chart, and the second one remains blank. How can I get around this issue?

只有第一个div填充了图表，第二个div保持空白。我怎样才能解决这个问题？

2 个解决方案

#1

Yes you can. See their example here: http://jsfiddle.net/gh/get/jquery/1.7.1/highslide-software/highcharts.com/tree/master/samples/highcharts/chart/renderto-jquery/

是的你可以。在这里查看他们的例子：http：//jsfiddle.net/gh/get/jquery/1.7.1/highslide-software/highcharts.com/tree/master/samples/highcharts/chart/renderto-jquery/

basically you assign an jQuery element to a variable:

基本上你将jQuery元素分配给变量：

renderTo: $('.myclass')[0]

renderTo：$（'。myclass'）[0]

#2

As Ido already said, you can't have multiple ids, but you can have multiple classes.

正如Ido已经说过的那样，你不能拥有多个id，但是你可以拥有多个类。

I had to do the following:

我必须做以下事情：

var $containers = $('.container'),
    chartConfig = {
        chart: {
            renderTo: null,
            defaultSeriesType: 'column'
        }
    };

$containers.each(function(i, e){
    chartConfig.chart.renderTo = e;
    new Highcharts.Chart(chartConfig);
});

Also, you don't really have to assign the Chart object to a variable - at least I didn't want to.

此外，您不必将Chart对象分配给变量 - 至少我不想这样做。

Hope it helps somebody.

希望它对某人有帮助。

#1