ECharts と Java インターフェースを使用してデータ視覚化を作成: さまざまなタイプの統計グラフをマスターする

ECharts と Java インターフェイスを使用してデータ視覚化を作成します。さまざまなタイプの統計グラフを習得するには、特定のコード サンプルが必要です。

データ視覚化は、抽象データを変換する方法です。チャートを通じて データの背後にあるパターンや傾向をより深く理解できるように、データを視覚的に表示するテクノロジー。オープンソースの視覚化ライブラリとして、ECharts はさまざまなチャート タイプと柔軟な構成オプションを提供しており、データ視覚化の開発に非常に適しています。この記事では、ECharts と Java インターフェイスを使用してさまざまなタイプの統計グラフを作成する方法を紹介し、具体的なコード例を添付します。

1. 準備作業
ECharts をデータ視覚化に使用する前に、次の開発環境を準備する必要があります:

1. Java 開発環境をインストールし、Java Web プロジェクトを構築します。基本構造;
2. CDN を通じて導入するか、ローカル プロジェクトにダウンロードできる ECharts の JavaScript ファイルを紹介します;
3. データ視覚化チャートを表示するフロントエンド ページを作成します。

2. ヒストグラムを作成する
ヒストグラムは、さまざまなカテゴリのデータを比較するために使用できる一般的な統計グラフです。以下は、ヒストグラムを作成するためのサンプル コードです。

Java インターフェイスでは、データベースまたは他のデータ ソースを呼び出してデータを取得し、そのデータを JSON 形式に変換して、その JSON データをレンダリングを処理するためのフロントエンド ページ。

@RestController
@RequestMapping("/echarts")
public class EChartsController {

    @GetMapping("/bar")
    public Map<String, Object> getBarData() {
        Map<String, Object> data = new HashMap<>();
        
        // 模拟数据，实际情况可以从数据库或其他数据源获取
        List<String> xAxis = Arrays.asList("A", "B", "C", "D", "E");
        List<Integer> seriesData = Arrays.asList(10, 20, 30, 40, 50);
        
        data.put("xAxis", xAxis);
        data.put("seriesData", seriesData);
        
        return data;
    }
}

上記のコードでは、@RestController アノテーションを使用してクラスを Restful スタイルのコントローラーとして宣言し、@GetMapping("/bar")## を使用します。 # アノテーションはリクエストを処理するメソッドを指定します。このメソッドでは、いくつかのデータをシミュレートし、そのデータを Map オブジェクトにカプセル化しました。その Map オブジェクトが応答として返されます。

3. 折れ線グラフを作成する

折れ線グラフは一般的に使用される統計グラフで、時間の経過に伴うデータの変化やその他の連続変数の傾向を表示するために使用できます。以下は、折れ線グラフを作成するためのサンプル コードです。

@RestController
@RequestMapping("/echarts")
public class EChartsController {

    @GetMapping("/line")
    public Map<String, Object> getLineData() {
        Map<String, Object> data = new HashMap<>();
        
        // 模拟数据，实际情况可以从数据库或其他数据源获取
        List<String> xAxis = Arrays.asList("A", "B", "C", "D", "E");
        List<Integer> seriesData = Arrays.asList(10, 20, 30, 40, 50);
        
        data.put("xAxis", xAxis);
        data.put("seriesData", seriesData);
        
        return data;
    }
}

このサンプル コードでは、リクエスト パスと返されるデータを変更していることを除いて、基本的に前の棒グラフのサンプル コードと同じです。

4. 円グラフの作成

円グラフは、さまざまなカテゴリのデータの割合を表示するために使用できる一般的に使用される統計グラフです。以下は、円グラフを作成するためのサンプル コードです。

@RestController
@RequestMapping("/echarts")
public class EChartsController {

    @GetMapping("/pie")
    public List<Map<String, Object>> getPieData() {
        List<Map<String, Object>> data = new ArrayList<>();
        
        // 模拟数据，实际情况可以从数据库或其他数据源获取
        Map<String, Object> item1 = new HashMap<>();
        item1.put("name", "A");
        item1.put("value", 10);
        
        Map<String, Object> item2 = new HashMap<>();
        item2.put("name", "B");
        item2.put("value", 20);
        
        Map<String, Object> item3 = new HashMap<>();
        item3.put("name", "C");
        item3.put("value", 30);
        
        data.add(item1);
        data.add(item2);
        data.add(item3);
        
        return data;
    }
}

このサンプル コードでは、

List オブジェクト ## オブジェクトを使用して、各データ項目を Map# にカプセル化します。次に、すべての Map オブジェクトを List オブジェクトに追加します。最後に、List オブジェクトが応答として返されます。 概要

この記事では、ECharts と Java インターフェイスを使用して棒グラフ、折れ線グラフ、円グラフを作成する方法を紹介し、具体的なコード例を示します。これらのコード例を通じて、Java と ECharts を介してデータ視覚化を実装する方法と、レンダリングのためにバックエンドからフロントエンド ページにデータを渡す方法の基本プロセスを理解できます。この記事が、読者が ECharts と Java インターフェイスを使用したデータ視覚化の基本スキルを習得するのに役立つことを願っています。

以上がECharts と Java インターフェースを使用してデータ視覚化を作成: さまざまなタイプの統計グラフをマスターするの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。