7

Google チャート API でツールチップのスタイルを設定する方法はありますか? を使用してテキストの色のみを変更することができましたtooltip.textStyle白い背景他の色に変更する解決策はありますか(写真に示すように):

ここに画像の説明を入力

テストプレイグラウンドhttp://jsfiddle.net/nyNAg/

4

5 に答える 5

6

セレンディピティを通じて解決策を見つけました:

<style>
path {
  fill: yellow;
}
</style>

とにかく、Google チャート API で背景の構成オプションが見つかりませんでした。

于 2013-05-02T10:03:56.870 に答える
5

Google チャートのオプションに次のコードを記述して、ツールチップを HTML で処理できるようにします。コード: tooltip: { isHtml: true }(,) 必要に応じてコンマを追加します。:)

HTML と css を使用してツールチップのスタイルを設定できるようになりました。:)

/ CSS スタイリング/

ツールチップ ボックスのスタイルを設定するには:

div.google-visualization-tooltip {}

フォント サイズ、色などのコンテンツのスタイルを設定するには

div.google-visualization-tooltip > ul > li > span {}

必要なときにいつでも使用してください!important;)

http://jsfiddle.net/nyNAg/66/

于 2016-05-17T06:39:17.310 に答える
1

ラベルをカスタム HTML に完全に置き換えることができます。少し複雑かもしれませんが、コンテンツとスタイルを完全に制御できます。https://developers.google.com/chart/interactive/docs/customizing_tooltip_content#custom_html_contentを参照してください

于 2014-03-28T10:26:52.827 に答える
0

別のオプションは、インラインスタイルのルールをオーバーライドすることです。

li.google-visualization-tooltip-item span[style] { font-weight: normal !important; }

http://css-tricks.com/override-inline-styles-with-css/

于 2014-11-14T08:58:59.577 に答える
0

Google Chart Tools API は、そのサーバーでホストされている iframe を介して SVG チャートを実装しているため、 Same Origin Policyに従って、クライアントに応答を送信する前にサーバー側で操作しない限り、別のドメインのコンテンツにアクセスしたり変更したりすることはできません。

それを考えると、どうやってテキストの色を変更できたのかわかりません - おそらくブラウザのバグですか?

于 2012-07-25T20:47:02.700 に答える