Question

这让我发疯，我尝试了很多不同的选择。我正在浏览所有材料here，试图将尽可能多的ExtJS 4塞入我的脑中，以便进行项目。在绘图和图表部分，有两个例子。下面，第一个示例绘制一个黄色圆圈，第二个示例绘制没有圆圈。为什么呢？

第一个例子（绘制一个黄色圆圈）：

Ext.application({
name: 'HelloExt',
launch: function(){
    var drawComponent = Ext.create('Ext.draw.Component', {
        viewBox: false,
        items: [{
            type: 'circle',
            fill: '#ffc',
            radius: 100,
            x: 100,
            y: 100
        }]
    });

    Ext.create('Ext.Window', {
        width: 230,
        height: 230,
        layout: 'fit',
        items: [drawComponent]
    }).show();
}
});

第二个例子（不画圈子）：

Ext.application({
name: 'HelloExt',
launch: function(){
    // Create a draw component
    var drawComponent = Ext.create('Ext.draw.Component', {
        viewBox: false
    });

    // Create a window to place the draw component in
    Ext.create('Ext.Window', {
        width: 220,
        height: 230,
        layout: 'fit',
        items: [drawComponent]
    }).show();

    // Add a circle sprite
    var myCircle = drawComponent.surface.add({
        type: 'circle',
        x: 100,
        y: 100,
        radius: 100,
        fill: '#cc5'
    });
}
});

我已经尝试了无数种方法将Sprite添加到drawComponent中，唯一有效的方法是将它作为drawComponent实例化中的项目的声明成员。我在控制台中没有出错。

Answer 1

修复涉及将.show(true)添加到sprite语句的末尾。像这样：

var myCircle = drawComponent.surface.add({
    type: 'circle',
    x: 100,
    y: 100,
    radius: 100,
    fill: '#cc5'
}).show(true);

我真的希望这出现在ExtJS 4文档中。

ExtJS 4绘图和图表示例未绘制

1 个答案: