2014-02-18 38 views
2

我在選項中指定了HTML工具欄,但它仍然在工具提示中呈現HTML文本而不是HTML的結果。我該如何解決這個問題,以便呈現HTML結果?Google Chart HTML Tooltip顯示HTML文本

我創建一個數據視圖,設置欄目,像這樣:

projectView.setColumns([0,1,3,{ 
    type:'string', 
    role:'tooltip', 
    calc:function(dt,row){ 
     var date = dt.getFormattedValue(row,0); 
     var totalErrors = dt.getFormattedValue(row,3); 
     var percent = Math.round((dt.getValue(row,3)/dt.getValue(row,1))*100); 
     return '<div><b>'+ date +'</b><br><b>Error Percent: </b>' + percent + '<br><b>Total Errors: </b>' + totalErrors + '</div>'; 
    } 
}]); 

和選項的是這樣的:

var options = { 
    width:850, 
    height:375, 
    chartArea: {width: '70%', height: '70%',left: 40,top:25}, 
    hAxis:{format:'MM/dd/yy'}, 
    vAxis:{logScale:false},   
    series:{0:{type:'line'},1:{type:'area'}}, 
    tooltip: { isHtml: true }}; 

然後我繪製圖表:

var projectChart = new google.visualization.ComboChart(document.getElementById('project_chart_div')); 
projectChart.draw(projectView, options); 

回答

4

在視圖的計算列中指定html屬性爲true

projectView.setColumns([0,1,3,{ 
    type:'string', 
    role:'tooltip', 
    properties: { 
     html: true 
    }, 
    calc:function(dt,row){ 
     var date = dt.getFormattedValue(row,0); 
     var totalErrors = dt.getFormattedValue(row,3); 
     var percent = Math.round((dt.getValue(row,3)/dt.getValue(row,1))*100); 
     return '<div><b>'+ date +'</b><br><b>Error Percent: </b>' + percent + '<br><b>Total Errors: </b>' + totalErrors + '</div>'; 
    } 
}]);