このcodepenを参照してくださいChart.jsチャートのパディング

を削除します。このcodepenを参照してくださいChart.jsチャートのパディング

私は100％にキャンバスの幅を設定し、0にパディングが、チャートに仕事でいくつかの固有のパディングがあるように思わました.js。私はドキュメントを見てきましたが、ラベル埋め込みのようなもの以外の埋め込みについての参照はありません。

私はCSSで編集しようとしましたが、問題が発生していないようです。

canvas { 
    width:100%; 
    height: auto; 
    margin:0; 
    padding:0; 
}

おそらく、JavaScriptのキャンバスレンダリングパラメータの問題です。

このパディングを制御できないため、応答可能なサイトを完全に苦労するように設計できます。

これに対する解決策がない場合は、レスポンシブサイトに適した別のjavascriptチャーティングパッケージの提案はありますか？

私はd3の経験がありますが、単純な円グラフの場合はそれが過剰です。

出典

2017-01-09 Satki

パディングの全ピクセルを削除することは、反応性テンプレートを作成するための解決策ではありません。なぜあなたはひどく見える縁に至るまでグラフィックを傷つけるのですか？ –

本当に私が求めていた質問はありません。 Chart.jsが幅を生成するグラフは、実際にキャンバス幅の50％のようなものです。グラフの幅をキャンバスの幅などの90％に拡大する方法があるかどうかを知りたい。実際に私が思うCSS質問ではなく、おそらくキャンバスのレンダリング機能ともっと関係しています。質問を編集します。 – Satki

あなたは広い矩形に円を置くことができず、それが端までずっと進むと思っています。それはサークルのしくみではありません。一般に、それらは丸い。しかし、ウィンドウを縮小すると、凡例はほとんどすべての端まで行きます。 –

答えを見つけました。キャンバスの高さと幅の属性（CSSパラメータではない）を必要なアスペクト比に設定し、比率を維持しながら自動的にサイズを変更します。

出典

2017-01-09 19:55:59 Satki

このcodepenを参照してくださいChart.jsチャートのパディング

答えて

関連する問題