0

当我使用 jqplot 时,它会神奇地将绘图注入指定的 div chart1:

var chart1 = $.jqplot('chart1', weeks , {...

ExtJs 也是如此,它将创建的代码注入到“信息”div 中:

var testPanel = new Ext.Panel({
    title: "Test",
});
testPanel.render('info');

但是如何将 chart1 绘制到面板中?以下 html 不起作用:

<div id="info">            
    <div id="chart1" class="plot" style="width:400px;height:260px;"></div>
</div>

将 html 放入 extjs 也不起作用,因为 chart1 的 html 为空(此时!?):

var testPanel = new Ext.Panel({
  title: "Test",
  html: $('chart1').html()
});
testPanel.render('info');
4

1 回答 1

1

您必须在面板实例上设置一个监听器来监听render事件,然后将图表绘制到面板的主体上。

http://jsfiddle.net/chrisramakers/ZXDru/

Ext.onReady(function(){

    new Ext.Panel({
        renderTo: Ext.getBody(),
        frame: true,
        title: 'Test panel',
        height: 250,
        listeners: {
            render: function(){

                // this.body.dom is the raw dom object of the body element of this panel
                // render your plot to this.body.dom
                console.log(this.body.dom)
                this.body.update('This is the new content');
            }
        }
    });

});
于 2011-03-11T12:48:05.787 回答