Chart.jsパイのツールチップがカットされる
ゴズランの場合：
何らかの理由で切り取られたツールチップを含むChart.js円グラフを使用しています。
スクリーンショットを添付しましたが、それを処理する属性/オプションが見つかりませんでした。
とにかくそれを世話しますか？
ありがとう！
ブランド：
この不適切なカットオフは、ChartJSのGithubリポジトリでissue＃622として発生しました。
これはバグであると判断されました（明らかにこのバグはまだ修正されていません）
https://github.com/nnnick/Chart.js/issues/622
その問題に応えて、ロバート・タラルは彼が良い回避策であると言っている解決策を持っています。ここに彼の提案された修正があります：
これは、ツールチップがキャンバスの範囲内で生成されており、修正が困難なためと考えられます。
私はドーナツチャートで同じ問題を抱えており、samplesフォルダーの例に従ってカスタムツールチップを実装することで解決しました-チャート初期化コードで既存のツールチップのフォントサイズとテンプレート設定と連動しました：
var myDoughnutChart = new Chart(donut).Doughnut(donutdata, { tooltipFontSize: 10, tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%= value %>hrs", percentageInnerCutout : 70 });カスタムツールチップコードについては、samples / pie-customTooltips.htmlをご覧ください。コピー/貼り付けすると、すぐに機能しました。とても幸せです！
キャンバスの境界の外側にツールチップが表示されます。
PS：折れ線グラフの例もあり、これは棒グラフでうまく機能すると思います。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
編集
関連記事
Related 関連記事
- 1
Chart.jsのツールチップが表示されない
- 2
Chart.jsのツールチップが表示されない
- 3
カーソルが間違った位置にあると、Chart.jsのマウスオーバーツールチップが表示されます
- 4
chart.jsのツールチップにカスタムタイトルを追加する
- 5
ツールチップが表示されると、上部のChart.JS値が消えます
- 6
Chart.jsの望ましくないツールチップが凡例に表示される
- 7
混合チャートのChart.jsツールチップホバーのカスタマイズ
- 8
Chart.js 2.0ドーナツグラフのツールチップをカスタマイズする方法
- 9
Chart.JS-ツールチップ-問題：3つのデータポイント、3つの個別のツールチップすべてが各データポイントに表示されます
- 10
Chart.jsのツールチップ値は2行で表示されます
- 11
Chart.js 2.0 - ホバー時にツールチップに不完全なデータが表示される
- 12
チャートプロパティのイベントロードでchart.renderer.textを使用して、デフォルトのツールチップと同等のカスタムツールチップをマウスオーバーに配置する方法
- 13
chart.js棒グラフのツールチップをカスタマイズする
- 14
JavaScript-Chart.jsツールチップに間違ったx軸値が表示される
- 15
Chart.jsのマルチラベルツールチップ
- 16
Chart.js 2.0：ツールチップのタイトルを変更する方法
- 17
chart.jsでデータが重複しているラベルのツールチップが表示されない
- 18
JavaScript Chart.js-ツールチップに表示するカスタムデータフォーマット
- 19
Chart.js折れ線グラフのツールチップをカスタマイズするにはどうすればよいですか？
- 20
ツールチップの正方形にカスタムカラーを設定するChart.js
- 21
Chart.jsツールチップとY軸にカンマを追加する
- 22
Chart.js：ツールチップテンプレートの変更
- 23
ツールチップと重複するChart.jsプラグイン
- 24
Chart.js：ツールチップラベルの色付け
- 25
Chart.jsツールチップの背景色の設定
- 26
chart.jsでツールチップタイトルのデフォルトのコールバックを設定する方法
- 27
Chart.jsツールチップに％を表示する方法
- 28
Chart.jsツールチップに％を表示する方法
- 29
Chart.jsデカルト軸-データが対応するy軸に基づいてツールチップを変更する
コメントを追加