[英]Custom Tooltip in Google Sheets Org Chart
I am trying to find a way to make a custom tooltip under Org Chart built using the Google Sheets. 我正在尝试找到一种使用Google表格构建的组织结构图下的自定义工具提示的方法。
Currently, I have an Org chart that is built by simply selecting the data on the sheet and inserting the chart through the menu. 目前,我有一个组织结构图,可以通过简单地选择工作表上的数据并通过菜单插入该图表来构建。 I have recently learned that it is possible to have a custom tooltip (see an [example here][1][1]: https://developers.google.com/chart/interactive/docs/customizing_tooltip_content#tooltip-actions )
我最近了解到,可以使用自定义工具提示(请参见[此处的示例] [1] [1]: https : //developers.google.com/chart/interactive/docs/customizing_tooltip_content#tooltip-actions )
My data is currently under 3 columns. 我的数据目前在3栏以下。 I am unable to figure out how to call the data from the sheet to draw the org chart with custom tooltips.
我无法弄清楚如何从工作表中调用数据以使用自定义工具提示绘制组织结构图。
I would like to keep the ability to update the chart dynamically whenever the data is changed/added/removed from the sheet. 我想保持每当从工作表中更改/添加/删除数据时动态更新图表的能力。
Can someone please help me with this. 有人可以帮我吗
Best Regards, Syed H 最好的问候,Syed H
you need to use the property tooltip to true in the option 您需要在选项中使用属性工具提示为true
var options = {
tooltip: {isHtml: true},
legend: 'none'
};
then you can add tooltip in the AddColumns and you just have to pass the content tooltip in add Row 那么您可以在AddColumns中添加工具提示,而只需在添加行中传递内容工具提示
function drawChart() {
var dataTable = new google.visualization.DataTable();
dataTable.addColumn('string', 'Year');
dataTable.addColumn('number', 'Sales');
// A column for custom tooltip content
dataTable.addColumn({type: 'string', role: 'tooltip'});
dataTable.addRows([
['2010', 600,'First Tooltip'],
['2011', 1500, 'Second Tooltip'],
['2012', 800, 'Third Tooltip'],
['2013', 1000, '$1M in sales last year.']
]);
Here is a JSFiddle Example for Bar chart: https://jsfiddle.net/foufrix/qfcps6vu/3/ 这是条形图的JSFiddle示例: https ://jsfiddle.net/foufrix/qfcps6vu/3/
And here is for Org Chart : https://jsfiddle.net/foufrix/z3fvm9p1/2/ 这是组织结构图: https : //jsfiddle.net/foufrix/z3fvm9p1/2/
Custom Tooltip for org Chart using css : https://jsfiddle.net/z3fvm9p1/7/ Implementation of W3S code : https://www.w3schools.com/css/css_tooltip.asp 使用CSS的组织结构图自定义工具提示: https ://jsfiddle.net/z3fvm9p1/7/ W3S代码的实现: https ://www.w3schools.com/css/css_tooltip.asp
If you have dynamique Data you can listen to it and everytime it changes you can relaunch the function drawChart 如果您具有动态数据,则可以收听它,并且每次更改时都可以重新启动功能drawChart
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.