インターネットの急速な発展とデータの急速な増加に伴い、データの視覚化はデータ分析と表示の重要な手段となっています。一般的なデータ視覚化方法には、棒グラフ、折れ線グラフ、円グラフ、散布図などが含まれます。この記事では、PHP と Highcharts を使用してデータ視覚化チャートを作成し、データが直感的な視覚効果を表現できるようにする方法を紹介します。
1. Highcharts の概要
Highcharts は、JavaScript ベースのオープンソースのグラフ作成ライブラリであり、インタラクティブなグラフやマップの作成に使用できます。 Highcharts は、線形グラフ、面グラフ、散布図、円グラフ、棒グラフなど、多くの種類のグラフをサポートしています。 Highcharts 自体のテーマとスタイルは、さまざまなシナリオのニーズに合わせてカスタマイズできます。同時に、Highcharts は jQuery などの一般的なフロントエンド フレームワークとシームレスに統合でき、使いやすくなります。
2. 環境セットアップ
Highcharts をインストールする前に、PHP 開発環境をセットアップする必要があります。ローカル環境を構築するか、Alibaba Cloud、Tencent Cloud などのクラウド プラットフォーム サービスを使用するかを選択できます。
PHP 環境をセットアップしたら、公式 Web サイトから Highcharts の最新バージョンをダウンロードし、ローカル環境に解凍します。次に使用するファイルは、highcharts.js、jquery.js、data.php です。
高さと幅はカスタマイズできます。コードは次のとおりです。
5d2a7c527f905d0f8870affc576f6085
16b28748ea4df4d9c2150843fecfba68
3. データ呼び出し
data.php では、データを配列に保存できます。ここでは例としてヒストグラムを取り上げます。 x 軸と y 軸の値が含まれます。コードは次のとおりです。
7d2bf802f142d9fc7da5e6206dce4c97
data.php にアクセスすると、データの Json 配列を取得し、データ処理を完了できます。背景を読んでください。
4. チャートの生成
Highcharts API を使用して HTML でヒストグラムを生成するコードは次のとおりです。
$(function () {$('#container').highcharts({ chart: { type: 'column' }, title: { text: '月销售额' }, xAxis: { categories: [<?php foreach($data as $val) { echo "'".$val['category']."',"; } ?>] }, yAxis: { title: { text: '销售额 (元)' }, min: 0 }, tooltip: { valueSuffix: '元' }, series: [{ name: '销售额', data: [<?php foreach($data as $val) { echo $val['value'].","; } ?>] }] });
上記のコードを通じて、次のヒストグラムを生成できます:
以上がPHP と Highcharts を使用してデータ視覚化チャートを作成するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。