Google Charts：如何增加工具提示的宽度

Question

我正在使用Google Charts柱形图。

如果您观察到服务器计算时间值被破坏到下一行，请执行此操作。 根据要求，它应该在同一行。 请帮助我解决方案

Answer 1

设置图表选项tooltip以确保显示html工具提示

  tooltip: {
    isHtml: true
  }

然后你可以覆盖工具提示类，
使用以下css来防止包装......

.google-visualization-tooltip-item {
  white-space: nowrap;
}

Answer 2

尝试在此类.google-visualization-tooltip上添加一些CSS属性：

.google-visualization-tooltip { width:300px; background-color: red; }

如下例所示：https://jsfiddle.net/zrmwtj3z/

Answer 3

最好的解决方案是不要手动增加工具提示的宽度。而是在工具提示的HTML中，将整个内容包装在div元素中。使用CSS样式white-space: nowrap;强制其保持在同一行。我还喜欢添加margin: 1em;，以使其看起来更好一些。