Question

现在我无法在extJS面板中显示简单的Raphael图形。

afterRender: function(){
        var size = Math.min(this.getHeight(), this.getWidth());
        this.innerEl = this.el.createChild({
            cls : 'ext-ux-clock-inner'
        });
        this.canvas = Raphael(this.innerEl.dom, size, size);
        var circle = this.canvas.text(50, 40, 'test').attr( {
              font : '14px Helvetica, Arial',
              stroke : "none",
              fill : '#fff'
            });
        TimelineWindowPanel.superclass.afterRender.apply(this,arguments);
    }

文本在Firefox和Chrome中显示正常，但我似乎无法在IE8中显示此文本。我已经尝试使用未压缩版本以及缩小版本而没有运气。有人知道拉斐尔为何不使用带有extJS的IE8吗？

修改如果我将IE8更改为兼容模式，则会显示Raphael图形

Answer 1

我找到了解决IE8的问题。似乎IE8在ExtJS窗口出现在屏幕上之前尝试绘制到画布上。我猜测正在发生的事情是IE8试图在画布上绘制并失败并且不会尝试重绘。所以拉斐尔的形象永远不会出现在画布上。我能够通过使用javascript函数setInterval()

将绘制延迟0.3秒来解决这个问题。

拉斐尔图形没有在IE8中显示

1 个答案: