ExtJS表面和精灵创建功能

我正在尝试创建一个ExtJS应用程序，以基于XML文件创建曲面，然后可以通过鼠标在这些曲面上添加精灵。我在实际函数方面遇到了一些麻烦，这些函数是通过可以从前面列举的源中获得的参数来创建曲面和精灵的。当我在JS控制台中检查tham的值时，我创建的对象返回时未定义。我在它报告的JS中没有任何错误或警告。这是代码：

Ext.ns('myNameSpace');//create namespace to hold all variables
    myNameSpace = {
        init: function(){//initialize namespace
            function surfaceCreator(name){//create surface based on parameter
                var name = Ext.create('Ext.draw.Component', {
                    viewBox: false
                });
                return name;
            }
            function spriteCreator(surfaceName,sprite,posX,posY){//draw sprite based on parameters
                var sprite = Ext.create('Ext.draw.Sprite', {
                    type: 'circle',
                    x: posX,
                    y: posY,
                    radius: 25,
                    surface: surfaceName.surface,
                    fill: '#cc5'
                });sprite.show(true);
            }
            var mySurface = 'mySurface';//this could be an xml value
            var myCircle = 'myCircle';//this could be determined by numbering each one that is created.
            var myActualSurface = surfaceCreator(mySurface);//call function to create surface and return surface name as an object
            spriteCreator(myActualSurface,myCircle,20,20);//call function to create sprite on specified surface. Also, I could use the mouse coordinates to determine where the sprite should be drawn and make this trigger on 'click'.
            var myWin = Ext.create('Ext.Window', {// Create a window to house the surfaces
                width: 800,
                resizeable: false,
                height: 600,
                layout: 'fit',
                items: myActualSurface//This seems to be undefined somehow and I'm not sure why, as it is defined up above.
            }).show();
        }
    }
Ext.onReady(myNameSpace.init,myNameSpace);//render namespace when webpage is ready.

如果我能对这里可能发生的事情有第二种看法，我会非常高兴。如果有人有一个解决方案（很可能我只是用错了什么），我会欣喜若狂。感谢您的时间和考虑。