[英]Spotfire Javascript Output Disappeared
我在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>
我看了看例子,應該是:
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>
我們的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())
})
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.