谷歌圖表燭臺圖表中的自定義工具提示文本

Question

我在Google圖表API中玩了一下，實際上我需要更改蠟燭圖表工具提示中顯示的默認文本。不僅改變風格，而且它的內容。
有誰知道如何實現它？

Answer 1

你可以拖放到這一點谷歌的可視化遊樂場：

function drawVisualization() { 
    data = new google.visualization.DataTable() 
    data.addColumn('string', 'Date'); 
    data.addColumn('number'); 
    data.addColumn('number'); 
    data.addColumn('number'); 
    data.addColumn('number'); 
    data.addColumn({type:'string',role:'tooltip'}); 
    data.addRow(); 
    base = 10; 
    data.setValue(0, 0, 'Datapoint1'); 
    data.setValue(0, 1, base++); 
    data.setValue(0, 2, base++); 
    data.setValue(0, 3, base++); 
    data.setValue(0, 4, base++); 
    data.setValue(0, 5, " This is my tooltip1 "); 

    data.addRow(); 
    data.setValue(1, 0, 'Datapoint2'); 
    data.setValue(1, 1, base++); 
    data.setValue(1, 2, base++); 
    data.setValue(1, 3, base++); 
    data.setValue(1, 4, base++); 
    data.setValue(1, 5, "This is my second tooltip2"); 

    // Draw the chart. 
    var chart = new google.visualization.CandlestickChart(document.getElementById('visualization')); 
    chart.draw(data, {legend:'none', width:600, height:400}); 
} 

Answer 2

試試這個代碼中使用html標籤，自定義提示內容。

data.addRows([ 
      ['Mon', 20, 28, 38, 45, customTooltip('Monday')], 
      ['Tue', 31, 38, 55, 66, customTooltip('Tuesday')], 
      ['Wed', 50, 55, 77, 80, customTooltip('Wednesday')], 
      ['Thu', 77, 77, 66, 50, customTooltip('Thursday')], 
      ['Fri', 68, 66, 22, 15, customTooltip('Friday')] 
    ]); 

function customTooltip(text) { 
    return '<div style="padding:5px 5px 5px 5px;">' + 
'<table id="medals_layout" style=" color:#db6acf; font-size:large">' + '<tr>' + 
'<td><b>' + text + '</b></td>' + '</tr>' + '</table>' + '</div>'; 

} 

看看這個jqfaq.com有折線圖