Zingchart - 將一個函數傳遞給工具提示

是否可以將一個函數傳遞給Zingchart Json中的工具提示鍵？Zingchart - 將一個函數傳遞給工具提示

我試過到目前爲止以下：

$scope.applyTooltip = function (timestamp) { 
    console.log(timestamp); 
    var tooltip = "<div>"; 
    var data = { 
    timestamp1: { 
     param1: "bla", 
     param2: "foo, 
    }, 
    ... 
    } 

    for(var param in data){ 
     console.log(param); 
     tooltip += param+": "+data[param]+"<br>"; 
    } 
    tooltop += "</div>; 

    return tooltip; 
    }  


$scope.graphoptions = { 
    //... 
    //just displaying the relevant options 

    plot: { 
     "html-mode": true, 
     tooltip: $scope.applyTooltip("%kt"), 
    } 
}

}

但功能得到字符串「％克拉」，因爲它是不懸停情節的通緝x值。那麼如何在函數中傳遞X值？

來源

2016-05-04 GuyWithCookies

ZingChart不允許通過配置對象傳遞函數。相反，有一個名爲「jsRule」的屬性，它允許您在每個工具提示事件期間傳遞一個函數名稱以進行評估。

tooltip : { 
    jsRule : "CustomFn.formatTooltip()" 
}

內部的功能，參數將可用，將包含有關您將鼠標停留在節點信息，例如value，scaletext，plotindex，nodeindex，graphid，等等。只需返回工具提示的對象（包括格式化文本），ZingChart就會處理剩下的事情。示例在下面提供。

jsRule的一個注意事項是函數名必須全局訪問，因爲ZingChart不接受內聯函數。我們意識到這個問題，並計劃在未來的版本中作爲選項。

CustomFn = {}; 
 

 
    var myConfig = { 
 
    \t type: "line", 
 
    \t tooltip : { 
 
    \t jsRule : "CustomFn.formatTooltip()" 
 
    \t }, 
 
    \t series : [ 
 
    \t \t { 
 
    \t \t \t values : [1,3,2,3,4,5,4,3,2,1,2,3,4,5,4] 
 
    \t \t }, 
 
    \t \t { 
 
    \t \t \t values : [6,7,8,7,6,7,8,9,8,7,8,7,8,9,8] 
 
    \t \t } 
 
    \t ] 
 
    }; 
 
    
 
    
 
    CustomFn.formatTooltip = function(p){ 
 
    var dataset = zingchart.exec('myChart', 'getdata'); 
 
    var series = dataset.graphset[p.graphindex].series; 
 
    
 
    var tooltipText = ""; 
 
    for (var i=0; i < series.length; i++) { 
 
     tooltipText += "Series " + i + " : " + series[i].values[p.nodeindex] + ""; 
 
     if (i !== series.length-1) { 
 
     tooltipText += "\n"; 
 
     } 
 
    } 
 
    return { 
 
     text : tooltipText, 
 
     backgroundColor : "#222" 
 
    } 
 
    } 
 

 
    zingchart.render({ 
 
\t id : 'myChart', 
 
\t data : myConfig, 
 
\t height: 400, 
 
\t width: 600 
 
});

<!DOCTYPE html> 
 
<html> 
 
\t <head> 
 
\t \t <script src= 'https://cdn.zingchart.com/2.3.1/zingchart.min.js'></script> 
 
\t </head> 
 
\t <body> 
 
\t \t <div id='myChart'></div> 
 
\t </body> 
 
</html>

來源

2016-05-04 21:27:36

Zingchart - 將一個函數傳遞給工具提示

回答

相關問題