0

为什么当我将函数添加到 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);

}
4

1 回答 1

0

有一些问题，也许有些与只是将一些位粘贴到 SO 有关，但我会提到它们以防万一。

componentThermometer() 是什么或在哪里？我没有看到它在任何地方定义。

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

因此，当页面完成加载时，您调用 componentThermometer.MyMethod()。

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

我想你想要做的是把 myMethod 放在 Snap.load 处理程序之外（我目前看不出有任何理由让它在那里）。并且您可能只想在 Snap.load 完成后调用 myMethod（而不是当前在加载后定义它）。

如果您可以仅使用 jsfiddle 上的基础知识来获得一个测试示例以进一步提供帮助，那将有所帮助。

从codepen，这就是我将如何做到的......

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);
于 2014-10-20T13:53:06.307 回答