Softonic

円グラフ作成ツール

ステップ 1 / 3

グラフデータ

表計算ファイルをアップロードせずに、小規模なカテゴリーデータを見やすい円グラフやドーナツグラフにできます。項目名と値を入力するか、CSVまたはタブ区切りデータを貼り付け、色、データラベル、凡例の位置、開始角度を調整します。プレビューにはテキストによる要約とアクセシブルなデータ表も表示されます。書き出しはブラウザー内で処理され、1200 × 800のPNGまたは拡大しても鮮明なSVGとして保存できます。円グラフは、意味のある1つの全体を構成する、少数の0以上の項目を示す場合に適しています。

円グラフの作り方

  1. 1

    項目を入力する

    項目名と値の行を追加するか、2列のCSVまたはタブ区切りデータを貼り付けます。

  2. 2

    見た目を整える

    円グラフまたはドーナツグラフ、配色、データラベル、凡例の位置、並べ替え、開始角度を選びます。

  3. 3

    アクセシブルな結果を確認する

    グラフ、代替テキスト、表に示された正確な値と割合を確認します。

  4. 4

    グラフを書き出す

    1200 × 800のPNGまたはSVGを保存するか、元データをCSVとしてコピーします。

円グラフで分かること

円グラフでは、各正の値を360°の円周上の角度に置き換えます。ある項目の値が v、表示対象の値の合計が T の場合、その中心角は 360 × v / T、表示割合は 100 × v / T です。ドーナツグラフも比率の計算は同じで、中央をくり抜いて表示するだけです。比較の仕組み自体は変わりません。

項目 値 割合 扇形の角度
商品 45 45% 162°
サービス 30 30% 108°
サポート 25 25% 90°

この例の合計は100なので、商品は 45 / 100 × 360 = 162° を占めます。0は入力できますが面積がないため円には表示されません。負の値、未入力、有限でない値は、通常の「全体に対する部分」を表せないため使用できません。少なくとも1項目は0より大きい必要があります。

別のグラフを選ぶべき場合

円グラフは、扇形の数が少なく、各値の差がはっきりしていると読み取りやすくなります。値が近い、項目数が多い、正確な比較が重要、または項目が1つの合計を構成しない場合は、一般に棒グラフの方が適しています。時系列の変化には折れ線グラフが向いています。重複する割合を足したり、同じ値を二重計上したりしないでください。見た目を整えても、合計の定義が誤っていれば正しいグラフにはなりません。

色、ラベル、アクセシビリティ

意味を色だけに頼らせないことが大切です。凡例または扇形のデータラベルを残し、併記される表も確認してください。幅広い人に共有する場合は、色覚多様性に配慮した配色を選べます。小さな扇形には円内の文字が収まらないことがありますが、項目名、値、割合は凡例とデータ表で確認できます。SVGは編集や高精細な印刷に、固定サイズの1200 × 800 PNGはスライド、文書、SNS投稿に便利です。

グラフはブラウザーのSVG APIとCanvas APIで生成され、グラフデータが外部の作図サービスへ送信されることはありません。複数ステップの進行状況は、このタブのセッションストレージに一時保存されます。最初からやり直すか、タブを閉じると消去できます。

詳しくは、Datawrapperの円グラフは少数の項目で作るためのガイド、W3Cのアクセシブルなデータ表のチュートリアル、MDNのSVG画像を<desc>で説明する方法も参照してください。

よくある質問

はい。項目名と値が入った2列をコピーして、インポート欄へ貼り付けてください。表計算ソフトのタブ区切り行、カンマ区切りCSV、セミコロン区切りの行に対応し、引用符で囲まれたCSVの項目名も読み取れます。

0には角度方向の面積がないため、入力はできますが円には表示されません。負の値は通常の全体に対する扇形として表せないため使用できません。少なくとも1項目は0より大きい必要があります。

どちらも割合の表し方は同じです。全体と各部分の関係を直接示すなら円グラフ、中央に合計を表示したいならドーナツグラフが便利です。正確な値の比較を重視する場合は棒グラフを選びましょう。

生成されるSVGにはテキストによる要約があり、各扇形にも説明が付きます。ページには、表示対象のすべての項目名、値、割合を収めた一般的な表も用意されます。別の場所で公開する場合も、表または同等のテキスト説明を添えてください。

いいえ。行データ、タイトル、デザイン設定はブラウザー内にとどまります。複数ステップの操作中は、このタブのセッションストレージだけに保存されます。PNGとSVGも端末内で生成され、データがURLに入ることはありません。

関連ツール

マテリアルデザイン カラーピッカー

Material Designのカラーパレットを閲覧できます。任意の色調（50からA700）を1タップでHEX、RGB、HSL形式でコピーできます。

旗作成ツール

6種類のレイアウト、色、文字、シンボルで、シンプルな3:2のカスタム旗をブラウザ内でデザインします。SVGまたはPNGをダウンロードするか、ブラウザの印刷ダイアログを開けます。

方眼紙ジェネレーター

印刷できる方眼紙をオンラインで作成：方眼またはドット罫を選び、間隔をmmで設定し、A4かLetterと好きな線の色を指定して、印刷または鮮明なSVGでダウンロードできます。

ビジョンボードメーカー

目標をひとつのボードに視覚化：画像をアップロードし、オリジナルのタイトルとキャプションを添え、色とレイアウトを選べば、印刷用のPNGとしてダウンロードできます。入力した内容はすべてブラウザの中だけにとどまります。

クロスステッチ図案メーカー

JPEG・PNG・WebPを、10～150目、2～40色、記号、正確な目数、布サイズ付きの印刷可能なクロスステッチ図案に変換します。

ティアリスト作成ツール

テキストと端末内の画像から、非公開のティアリストを作成できます。行を編集し、ドラッグ操作やキーボードで順位付けして、JSON・PNG・SVGに書き出せます。

このツールは他の言語でも利用できます