ホームページ > バックエンド開発 > PHPチュートリアル > PHP を使用してデータを視覚化する方法

PHP を使用してデータを視覚化する方法

王林
リリース: 2023-06-11 09:42:01
オリジナル
2214 人が閲覧しました

データの視覚化は、データを処理する際に多くの企業や個人が現在細心の注意を払っている問題であり、複雑なデータ情報を直観的で理解しやすいチャートや画像に変換することで、ユーザーが内在する法則やデータをより深く理解できるようにします。データの傾向。 PHP は効率的なスクリプト言語として、データ視覚化においても一定の利点を持っています。この記事では、PHP をデータ視覚化に使用する方法を紹介します。

1. PHP チャート プラグインを理解する

PHP データ視覚化の分野では、多数のチャート プラグインがチャートの描画、チャートの美化、チャート データなどの機能を提供します。プレゼンテーション。一般的で優れた PHP チャート プラグインには、Highcharts、ECharts、Jpgraph などがあります。

Highcharts は、Highsoft によって開発および保守されている JavaScript ベースのグラフ ライブラリであり、基本的な折れ線グラフ、縦棒グラフ、グラフ チャート、円グラフなど、さまざまな種類のグラフをサポートしています。利点は、複数のブラウザに対応し、美しいグラフ表示効果を持ち、多言語環境をサポートしていることです。

ECharts は、Baidu によって開発されたオープン ソース データ視覚化ツールのセットで、クロスプラットフォーム、動的な対話、優れたデータ視覚化効果という利点があります。また、折れ線グラフ、棒グラフ、折れ線グラフ、円グラフ、バブル チャートなど、さまざまな種類のグラフもサポートしています。

JPGraph は、静的画像グラフの生成に特に使用される PHP グラフ ライブラリです。複数の PHP バージョンと互換性があり、複数のデータ型と、グラフのスケーリング、凡例のカスタマイズ、データ ラベルなどのさまざまな高度な機能をサポートしています。 。

2. PHP コードを介してチャート描画を実装する

適切な PHP チャート プラグインを選択した後、PHP コードを介して関連するライブラリを呼び出して、チャートの描画を実現できます。以下は、Highcharts を使用して縦棒グラフを描画する例です:

1. Highcharts の js ライブラリを導入します

<script src="https://cdn.jsdelivr.net/npm/highcharts@9.1.0/highcharts.js"></script>
ログイン後にコピー

2. HTML コンテナを作成します

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
ログイン後にコピー

3. 書き込みますPHP コード

<?php
// 1. 数据连接和查询
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = '';
$dbname = 'test';
$conn = mysqli_connect($dbhost, $dbuser, $dbpass) or die ('Error connecting to mysql');
mysqli_select_db($conn, $dbname);
$sql = 'SELECT * FROM employee';
$result = mysqli_query($conn, $sql);
$data = array();
foreach ($result as $row) {
    $data[] = array($row['name'], (int)$row['salary']);
}
mysqli_close($conn);

// 2. 绘制图表
echo '
<script>
Highcharts.chart("container", {
    chart: {
        type: "column"
    },
    title: {
        text: "员工薪资情况"
    },
    xAxis: {
        type: "category"
    },
    yAxis: {
        title: {
            text: "薪资 (元)"
        }
    },
    series: [{
        name: "薪资",
        data: '.json_encode($data).'
    }]
});
</script>
';
?>
ログイン後にコピー

上記の PHP コードを使用すると、単純な縦棒グラフを正常に描画できます。グラフ データは、MySQL データベースの従業員テーブルから取得されます。

3. JavaScript と連携して動的な対話を実現します

通常、静的なグラフの描画に加えて、凡例をクリックして特定の項目を表示または非表示にするなど、グラフとの動的な対話を実装する必要もあります。データの表示やマウスオーバー時の表示 データの詳細などこれには JavaScript と PHP コードを使用する必要があります。以下では例として Highcharts を使用して説明します。

  1. まず、Highcharts と関連する JavaScript コードを HTML に導入します
<script src="https://cdn.jsdelivr.net/npm/highcharts@9.1.0/highcharts.js"></script>


ログイン後にコピー
  1. 次に、PHP コードを記述して、単純な縦棒グラフを描画します
<?php
// 数据查询和处理
$categories = array('第一季度', '第二季度', '第三季度', '第四季度');
$seriesData = array(
    array(
        'name' => '销售额',
        'data' => array(100, 120, 150, 250)
    ),
    array(
        'name' => '净利润',
        'data' => array(50, 70, 100, 150)
    )
);

// 动态交互
?>
<script>
Highcharts.chart("container", {
    chart: {
        type: "column"
    },
    title: {
        text: "销售额和净利润"
    },
    xAxis: {
        categories: <?php echo json_encode($categories); ?>
    },
    yAxis: [{
        title: {
            text: "销售额"
        }
    }, {
        title: {
            text: "净利润"
        },
        opposite: true
    }],
    series: <?php echo json_encode($seriesData); ?>
});
</script>
ログイン後にコピー
  1. 次に、凡例をクリックすることで対応するデータを表示または非表示にする、JavaScript を介して動的インタラクティブ イベントを作成します。
<script>
document.getElementById('container').addEventListener('click', function(e) {
    var chart = Highcharts.chart('container');
    if (e.target.tagName == 'tspan') {
        var seriesIndex = parseInt(e.target.parentNode.getAttribute('data-highcharts-series'));
        var series = chart.series[seriesIndex];
        if (series.visible) {
            series.hide();
        } else {
            series.show();
        }
    }
}, false);
</script>
ログイン後にコピー

上記の手順により、クリックの動的な表示を実装することに成功しました。または、データの縦棒グラフを非表示にし、JavaScript スクリプトを使用して動的な相互作用効果を実現します。

概要

データ視覚化は、データを理解するためのより直観的かつ効率的な方法をユーザーに提供することを目的としています。多用途かつ効率的なプログラミング言語として、PHP は適切なグラフ プラグインやさまざまなアニメーション機能を使用できます。 JavaScript で提供される機能により、豊富で多様なデータ視覚化効果を実現できます。ただし、使用中のデータのセキュリティにも注意を払い、チャートに対するクロスサイト スクリプティング攻撃などの問題に迅速に対処して、データの視覚化をより安全で信頼性の高いものにし、データ分析と意思決定の効率的かつインテリジェントな開発を促進する必要があります。 。

以上がPHP を使用してデータを視覚化する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート