Spotfire Javascript输出消失

Question

我在Spotfire文字区域中有一个小的JavaScript。 它按设计工作。 我保存并关闭了Spotfire。 重新打开后，它根本不显示。 我的代码如下。 任何帮助，将不胜感激。

 resource = [ "//cdn.rawgit.com/toorshia/justgage/master/raphael-2.1.4.min.js", "//cdnjs.cloudflare.com/ajax/libs/justgage/1.2.8/justgage.js" ] //add scripts to head $.getScript(resource[0], function() { $.getScript(resource[1], init) }) var init = function() { var g = new JustGage({ id: "gauge", min: 0, max: 100, customSectors: [{ "lo": 0, "hi": 89.999, "color": "#f05050" }, { "lo": 90, "hi": 92.999, "color": "#DD7502" }, { "lo": 93, "hi": 100, "color": "#41c572" } ], levelColorsGradient: false }); //refresh gauge when calcvalue changes $(calcValue).on('DOMSubtreeModified', function() { g.refresh($(this).text()) }) } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <span id=calcValue><SpotfireControl id="3321e4c9003142ad83fdb753e6f66605" /> </span> <DIV id=gauge></DIV> 

Answer 1

我看了看例子，应该是：

 resource = [ "//cdn.rawgit.com/toorshia/justgage/master/raphael-2.1.4.min.js", "//cdnjs.cloudflare.com/ajax/libs/justgage/1.2.8/justgage.js" ] //add scripts to head $.getScript(resource[0], function() { $.getScript(resource[1], init) }) var init = function() { var g = new JustGage({ id: "gauge", min: 0, max: 100, customSectors: {ranges: [{ "lo": 0, "hi": 89.999, "color": "#f05050" }, { "lo": 90, "hi": 92.999, "color": "#DD7502" }, { "lo": 93, "hi": 100, "color": "#41c572" } ]}, levelColorsGradient: false }); //refresh gauge when calcvalue changes //$(calcValue).on('DOMSubtreeModified', function() { // g.refresh($(this).text()) //}) window.setInterval( () => { g.refresh(Math.random()*100) }, 1000) } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <span id=calcValue><SpotfireControl id="3321e4c9003142ad83fdb753e6f66605" /> </span> <DIV id=gauge></DIV> 

Answer 2

我们的JustGage设置略有不同，但是我们遇到了相同的计算问题，即在网络浏览器等上打开仪表板时却没有显示出来。

问题（至少在我看来是这样）是异步代码。 原始代码是这样的：

    resource=[
     "//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.4/raphael-min.js",
     "//cdnjs.cloudflare.com/ajax/libs/justgage/1.2.9/justgage.js"
    ]


    $.getScript(resource[0],function(){
     $.getScript(resource[1],init3)
    })


    //init3 function generates the gauge chart
    init3 =function(){
      var g3 = new JustGage({
        id: "gaugeIRF", 
        value:  $('#calcValueIRF').text(), 
        min: 0,
        max: 100,
        levelColors : [  "#73CC06", "#dec121",  "#dec121", "#bd5537" ],
        levelColorsGradient: false,
        symbol:'%',
        pointer: true,
        gaugeWidthScale: 0.6,
        counter: true,
        relativeGaugeSize: true,
        title: "IRF Readmission Rate"
      });

      //refresh gauge when calcvalue changes
      $('#calcValueIRF').on('DOMSubtreeModified',function(){
        g3.refresh($(this).text())
      })
    }

init3函数将运行，并且当浏览器读取init3时，将计算CalcValue，但是有可能init3将在CalcValue能够给出数字之前完成运行。 这是异步的，并且两个过程的执行顺序不正确。 这就是为什么在打开浏览器或返回到仪表盘时，不会显示计算的原因。

解决方案是放置一个功能。 函数中的函数按JavaScript的正确顺序运行。 这是我的工作代码：

    resource=[
     "//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.4/raphael-min.js",
     "//cdnjs.cloudflare.com/ajax/libs/justgage/1.2.9/justgage.js"
    ]


    $.getScript(resource[0],function(){
     $.getScript(resource[1],init3)
    })


    //new function to get the calculated value
    function getValue3(){
      var newValue = $('#calcValueIRF').text()
      return newValue
    }


    init3 =function(){
      var g3 = new JustGage({
        id: "gaugeIRF", 
        value:  getValue3(), 
        min: 0,
        max: 100,
        levelColors : [  "#73CC06", "#dec121",  "#dec121", "#bd5537" ],
        levelColorsGradient: false,
        symbol:'%',
        pointer: true,
        gaugeWidthScale: 0.6,
        counter: true,
        relativeGaugeSize: true,
        title: "IRF Readmission Rate"
      });

      //refresh gauge when calcvalue changes
      $('#calcValueIRF').on('DOMSubtreeModified',function(){
        g3.refresh($(this).text())
      })
    }