Javascript 为什么当我将函数添加到Snap.load（…加载SVG…我的方法…）中时，我不能调用这个方法，它位于Snap.load（）的内部？

为什么我在Snap.load中添加函数…加载SVG。。。我的方法。。。然后我无法调用此方法，它位于Snap.Load的内部

function myComponent() {
    var paper = Snap("#svg3");

    Snap.load("svg/thermometer_o.svg", function (f) {
        paper.append(f);
        paper.selectAll("#empty").attr({fill: "#f00"});

       myMethod = function(perc){
            var v= 350 * ((perc) / 100);
            var py = (557 - v);
           animate = function(){   
          paper.selectAll("#empty").animate({height: v, y: py, x: "340"}, 3000);};
    };      


    });
}


function onPageLoad() {
    componentThermometer().myMethod(40);

} 

---

这里有一些问题，也许有些问题与粘贴一些位有关，但我会提到它们以防万一

组件温度计是什么或在哪里？我看不出它在任何地方有定义

如果它以某种方式调用myComponent，则需要考虑事件的顺序。load是异步的，因此可能需要任何时间

因此，当页面完成加载时，可以调用componentThermometer.MyMethod

如果我们知道myComponent的逻辑，那么在Snap.load完成之前，myMethod是不可用的。所以我不太确定该方法是如何可用的，除非在某个地方丢失的代码中发生了什么

我想您要做的是将myMethod放在Snap.load处理程序之外，我目前看不出它存在的任何原因。并且您可能只希望在Snap.load完成后调用myMethod，而不是在加载后当前正在定义它

如果您可以在JSFIDLE上获得一个测试示例，其中包含一些基础知识，这将有助于进一步的帮助

从代码笔，这里是我将如何做到这一点

var paper = Snap("#svg3");

function componentThermometer( perc ) {         
    Snap.load("https://raw.githubusercontent.com/chovancova/project/master/public_html/teplomer_1/svg/thermometer_o.svg", function(f){
        paper.append(f);
        paper.selectAll("#empty").attr({fill:"#f00"});

        animateThermometer( perc );       
  });
};   


function animateThermometer( perc ) {  
        var vyska =  350*( perc / 100);
        var py = 557-vyska  ;
        paper.selectAll("#empty").animate({height: vyska, y:py, x:"342.882"}, 800);
};

componentThermometer(50);

---

我曾试图将它放在Snap.load之外，但后来它什么也没做，因为它无法识别Snap.load中的元素。我把代码放在问题中是我不能在Snap.load之外调用这个函数。例如，componentThermometer 20.AnimateEthermometer 75为什么需要向componentThermometer添加一个额外的参数？AnimateEtherMometer在加载svg之前不存在，那么在加载svg之前如何调用它呢？您要么需要保持它的简单，要么将AnimateEtherMometer作为带有args的回调或其他内容传递，但这很混乱。