关于CSS：Google图表hAxis工具提示

Google Charts hAxis tooltip

我正在使用Google图表。
我正在尝试显示15家商店以及每个商店的点击次数。

现在一切正常。

我的问题在hAxis中。如您所见，商店的名称不完整，这很好，但是当我将鼠标悬停在一个不完整的名称上时，工具提示会向我显示一个空的黄色框，如下图所示。
enter

1
2
3
4
5
6
7
8
9

.goog-tooltip {
background-color: cyan;
color: magenta;
font-weight: bold;
}

.goog-tooltip > div {
background-color: lime !important;
}

请参阅以下工作摘要...

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74

google.charts.load('current', {
callback: drawChart,
packages: ['corechart']
});

function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Year');
data.addColumn('number', 'Q1');
data.addColumn('number', 'Q2');
data.addColumn('number', 'Q3');
data.addColumn('number', 'Q4');

data.addRow(['January 2016', 500, 100, 1200, 1000]);
data.addRow(['February 2016', 500, 100, 1975, 1000]);
data.addRow(['March 2016', 500, 100, 1200, 1000]);
data.addRow(['April 2016', 500, 100, 1200, 1000]);

// find v-axis max value
var vAxisMax = null;
for (var i = 1; i < data.getNumberOfColumns(); i++) {
var range = data.getColumnRange(i);
vAxisMax = vAxisMax || Math.ceil(range.max / 1000) * 1000;
vAxisMax = Math.max(vAxisMax, Math.ceil(range.max / 1000) * 1000);
}
// add buffer for annotation
vAxisMax += 400;

var options = {
backgroundColor: '#000000',
chartArea: {
top: 12,
bottom: 24,
left: 72
},
legend: {
position: 'none'
},
colors: ['#9427E0'],
hAxis: {
slantedText: true,
textStyle: {
color: '#ffffff'
}
},
vAxis: {
title: 'Amount',
viewWindow: {
max: vAxisMax
}
},
bar: {
groupWidth: '90%'
},
annotations: {
style: 'point',
alwaysOutside: true
},
width: 1100,
height: 300
};

var view = new google.visualization.DataView(data);
view.setColumns([
0,
1, { calc:"stringify", sourceColumn: 1, type:"string", role:"annotation" },
2, { calc:"stringify", sourceColumn: 2, type:"string", role:"annotation" },
3, { calc:"stringify", sourceColumn: 3, type:"string", role:"annotation" },
4, { calc:"stringify", sourceColumn: 4, type:"string", role:"annotation" }
]);

var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
chart.draw(view, options);
}

1
2
3
4
5
6
7
8
9

.goog-tooltip {
background-color: cyan;
color: magenta;
font-weight: bold;
}

.goog-tooltip > div {
background-color: lime !important;
}

1	<script src="https://www.gstatic.com/charts/loader.js">