将HighCharts渲染为类而不是id

将HighCharts渲染为类而不是id

本文介绍了将HighCharts渲染为类而不是id?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有以下工作正常:

  $(document).ready(function(){

get_data_for_chart();

函数get_data_for_chart(){
$ .ajax({
url:'get_data.aspx?rand ='+ Math.random() ,
类型:'GET',
dataType:'json',
错误:函数(xhr,状态,错误){
console.log(status);
console.log(xhr.responseText);
},
success:function(results){
var chart1;

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

}
});
}
});

其中HTML看起来像这样:

 < div id =portlet_content_18> 

用户可以动态选择哪个 portlet s /他想要在屏幕上。出于比较的原因,S / He也可以选择在屏幕上多次显示相同的 portlet



如果HTML最终变成:

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

只有第一个 div 会填入图表,第二个则保持空白。我该如何解决这个问题?

解决方案

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



基本上,您将jQuery元素分配给一个变量:
$ b

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


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:

<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.

So if the HTML ends up becoming:

<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?

解决方案

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/

basically you assign an jQuery element to a variable:

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

这篇关于将HighCharts渲染为类而不是id?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-02 21:00