ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery.Highcharts.js はヒストグラム円グラフ曲線を描画します chart_jquery

jQuery.Highcharts.js はヒストグラム円グラフ曲線を描画します chart_jquery

WBOY
WBOYオリジナル
2016-05-16 16:09:301255ブラウズ

データ統計および分析ビジネスでは、棒グラフ、円グラフ、および曲線グラフを 1 つのグラフに表示する必要がある場合があります。つまり、棒グラフから特定のデータを確認することができます。棒グラフでは変化の傾向が、円グラフではデータの各部分の割合がわかります。 Highcharts では、3 つの画像を 1 つに結合する効果を簡単に実現できます。

コードをコピー コードは次のとおりです:

var チャート;
            $(document).ready(function() {
                chart = new Highcharts.Chart({
                    チャート: {
                        renderTo: 'コンテナ',
                        デフォルトシリーズタイプ: 'エリア'
                    }、
                    タイトル: {
                        テキスト: '地域別の世界の人口増加の歴史と推定'
                    }、
                    サブタイトル: {
                        テキスト: '出典: Wikipedia.org'
                    }、
                    x軸: {
                        カテゴリ: ['1750', '1800', '1850', '1900', '1950', '1999', '2050'],
                        目盛りの配置: 'on',
                        タイトル: {
                            有効: false
                        }
                    }、
                    y 軸: {
                        タイトル: {
                            テキスト: '数十億'
                        }、
                        ラベル: {
                            フォーマッタ: function() {
                                この値を返す / 1000;
                            }
                        }
                    }、
                    ツールチップ: {
                        フォーマッタ: function() {
                            戻ります ''
                                 this.x ': ' Highcharts.numberFormat(this.y, 0, ',') ' 百万';
                        }
                    }、
                    プロットオプション: {
                        エリア: {
                            スタッキング: '通常'、
                            ラインカラー: '#666666',
                            lineWidth: 1,
                            マーカー: {
                                lineWidth: 1,
                                ラインカラー: '#666666'
                            }
                        }
                    }、
                    シリーズ: [{
                        名前: 'アジア'、
                        データ: [502, 635, 809, 947, 1402, 3634, 5268]
                    }、{
                        名前: 'アフリカ'、
                        データ: [106, 107, 111, 133, 221, 767, 1766]
                    }、{
                        名前: 'ヨーロッパ'、
                        データ: [163, 203, 276, 408, 547, 729, 628]
                    }、{
                        名前: 'アメリカ'、
                        データ: [18, 31, 54, 156, 339, 818, 1201]
                    }、{
                        名前: 'オセアニア'、
                        データ: [2, 2, 2, 6, 13, 30, 46]
}]
});
});

上記がこの記事で説明した内容のすべてです。jQuery を使用してヒストグラムや円グラフを描画するすべての人に役立つことを願っています。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。