Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/440.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Google图表-工具提示中显示的HTML源代码_Javascript_Google Visualization - Fatal编程技术网

Javascript Google图表-工具提示中显示的HTML源代码

Javascript Google图表-工具提示中显示的HTML源代码,javascript,google-visualization,Javascript,Google Visualization,我正在尝试使用Google图表,在工具提示中使用HTML显示饼图。 我遇到的问题是HTML源代码正在显示出来。我在数据列上设置了html:true,在选项中设置了tooltip.isHtml,我真的不确定现在还可以尝试什么! 以下是我的JS源代码: google.setOnLoadCallback( drawChart_1 ); function drawChart_1() { var data = google.visualization.arrayToDataTable( [ ['','

我正在尝试使用Google图表,在工具提示中使用HTML显示饼图。
我遇到的问题是HTML源代码正在显示出来。我在数据列上设置了html:true,在选项中设置了tooltip.isHtml,我真的不确定现在还可以尝试什么! 以下是我的JS源代码:

google.setOnLoadCallback( drawChart_1 );
function drawChart_1() {
  var data = google.visualization.arrayToDataTable( [
['','',''],
['Thing 1' , 200 , '<b>Thing 1</b><br/>&pound;200 (14%)' ],
['Thing 2' , 400 , '<b>Thing 2</b><br/>&pound;400 (29%)' ],
['Thing 3' , 600 , '<b>Thing 3</b><br/>&pound;600 (43%)' ],
['Thing 4' , 200 , '<b>Thing 4</b><br/>&pound;200 (14%)' ],
]);
data.setColumnProperty(2,'role','tooltip');
data.setColumnProperty(2,'html','true');
data.setColumnProperty(2,'p',{'html':true});  // tried with, and without this (and the next) line
//data.setColumnProperty(2,'properties',{'html':true});

  var options = {"height":300,"pieSliceText":"none","tooltip.isHtml":true,"pieHole":0.5,"legend":"none","pieSliceTextStyle":"none","chartArea":{"width":"100%","height":"80%"},"slices":[{"color":"#959595"},{"color":"#616161"},{"color":"#005131"},{"color":"#e2e2e2"}]};
  var chart = new google.visualization.PieChart( document.getElementById( 'piechart_div_1' ) );
  chart.draw( data , options );
}
google.setOnLoadCallback(绘图1);
功能图_1(){
var data=google.visualization.arrayToDataTable([
['','',''],
[Thing1',200',Thing1
200英镑(14%), [Thing2',400',Thing2
400英镑(29%), [Thing3',600',Thing3
600英镑(43%), [Thing4',200',Thing4
200英镑(14%), ]); setColumnProperty(2,'role','tooltip'); setColumnProperty(2,'html','true'); data.setColumnProperty(2,'p',{'html':true});//尝试使用或不使用此行(和下一行) //setColumnProperty(2,'properties',{'html':true}); 变量选项={“高度”:300,“PieSiceText”:“无”,“工具提示.isHtml”:true,“pieHole”:0.5,“图例”:“无”,“PieSiceTextStyle”:“无”,“图表区”:{“宽度”:“100%”,“高度”:“80%”,},“切片”:[{“颜色”:“#959595”},{“颜色”:“#61616161”},{“颜色”:“#005131”},{“颜色”:“颜色”:{“颜色”:; var chart=new google.visualization.PieChart(document.getElementById('PieChart\u div\u 1'); 图表绘制(数据、选项); }
那么,有人知道我在这件事上错在哪里吗?搜索这个问题只是为我指明了将tooltip.isHtml设置为true的方向,我已经这样做了。一些结果为我指明了在数据列上设置html:true的方向-在代码中,您可以看到一些尝试,但没有任何影响。

一些事情

首先,可以在数组中提供列定义

var data = google.visualization.arrayToDataTable([
  ['' , '' , {type:"string" , role:"tooltip" , p:{"html":true}}],
  ...
]);
而且肯定需要
p:{“html”:true}

接下来,在
选项
中,
工具提示
应该是带有键的对象

  "tooltip": {
    "isHtml":true
  },
vs

“tooltip.isHtml”:true

请参阅以下工作片段

google.charts.load('current'{
回调:函数(){
var data=google.visualization.arrayToDataTable([
[“”,,{type:“string”,role:“tooltip”,p:{“html”:true}},
[Thing1',200',Thing1
200英镑(14%), [Thing2',400',Thing2
400英镑(29%), [Thing3',600',Thing3
600英镑(43%), [Thing4',200',Thing4
200英镑(14%), ]); 变量选项={ “高度”:300, “文本”:“无”, “工具提示”:{ “isHtml”:真的吗 }, “pieHole”:0.5, “图例”:“无”, “文本样式”:“无”, “图表区”:{ “宽度”:“100%”, “高度”:“80%” }, “切片”:[ {“颜色”:“#9595”}, {“颜色”:“#6161”}, {“颜色”:“#005131”}, {“颜色”:“#e2”} ] }; var chart=new google.visualization.PieChart(document.getElementById('PieChart\u div\u 1'); 图表绘制(数据、选项); }, 软件包:['corechart'] });
谢谢你,这段代码运行得很好,为我指出了错误构建isHtml的方向。我发现由于某种原因,我的代码中实际上不需要p:{“html”:true}。