如何在Google Visualization API中添加多行注释？

Question

我正在尝试使用google可视化API生成带注释的LineChart,虽然我有它工作,但我希望能够在可能的情况下让注释包含换行符.不幸的是,Google的API似乎忽略了任何换行信息并在一行中显示所有内容.有没有人想出办法解决这个问题？

这是一个例子:

var data = new google.visualization.DataTable();
data.addColumn('string', 'Month');
data.addColumn('number', 'Sales');
data.addColumn({type:'string', role:'annotation'});
data.addColumn({type:'string', role:'annotationText'});
data.addRows([
    ['April',1000, 'A', "Stolen data\nSo-so month"],
    ['May',  1170, 'B', "Coffee spill\nAnother line\nA third line"],
    ['June',  660, 'C', "Wumpus attack"]
]);

我试过了\n, \\n, and <br />,那些都没用.

Answer 1

添加p': {'html': true}}到您的工具提示中

data.addColumn({type:'string', role:'tooltip','p': {'html': true}});

然后添加<br/>到工具提示内容

Answer 2

创建第二条注释行。

var data = new google.visualization.DataTable();
      data.addColumn('timeofday', 'Time');
      data.addColumn('number', 'Temp');
      data.addColumn({type:'string', role:'annotation'});
      data.addColumn({type:'string', role:'annotation'});
      data.addRows([
        [[4, 56, 00], 0, '0', 'rain'],    [[5, 56, 00], 10, '10', 'drizzle'],   [[6, 56, 00], 23, '23', 'cats'],  [[7, 56, 00], 17, '17', 'partly cloudy'],   [[8, 56, 00], 18, '18', 'sunny'],  [[9, 56, 00], 9, '9', 'sunny'],  [[10, 56, 00], 11, '9', 'sunny'], ]); 

看看这个https://jsfiddle.net/k6eocgLd/4/