近年、ビッグデータの発展により、データの可視化はますます重要な分野となっています。データの視覚化により、データの理解と分析が容易になるだけでなく、データの美しさも向上します。ビジュアライゼーションの分野では、データの特徴をより直観的に表示できる3D統計図がよく使われます。この記事では、ECharts と Java インターフェイスを使用して美しい 3D 統計グラフを作成する方法を紹介し、具体的なコード例を示します。
ECharts の概要
[ECharts](https://echarts.apache.org/zh/index.html) は、インタラクティブな効率的なチャートを構築するためのオープンソースの JavaScript ベースの視覚化ライブラリです。データ視覚化インターフェイス。 ECharts は、棒グラフ、折れ線グラフ、散布図、地図など、さまざまな種類のグラフをサポートしています。また、動的データや対話型機能もサポートしています。
Java インターフェースの概要
ほとんどの場合、グラフを描画するにはバックグラウンドからデータを取得する必要があります。したがって、データを取得するには Java インターフェイスを使用する必要があります。 Java インターフェースは、バックグラウンドと対話してデータを取得するために使用されるテクノロジーです。この記事では、Java インターフェイスを使用して、ランダムに生成されたデータを取得し、3D 統計グラフを描画します。
ステップ 1: 準備
まず、EChart をダウンロードする必要があります。最新版は[ECharts公式サイト](https://echarts.apache.org/zh/download.html)からダウンロードできます。さらに、Java コードを作成するには Java IDE (Eclipse など) も必要です。
ステップ 2: Java コードを記述する
以下は、バックグラウンドからランダムに生成されたデータを取得するための Java コードです:
@RequestMapping("/getChartData")
@ResponseBody
public String getChartData() {
int min = 1;
int max = 100;
JSONArray jsonArray = new JSONArray();
for(int i = 0; i < 10; i++) {
int num1 = (int)(Math.random() * (max - min) + min);
int num2 = (int)(Math.random() * (max - min) + min);
int num3 = (int)(Math.random() * (max - min) + min);
jsonArray.add(new JSONArray(Arrays.asList("data" + (i + 1), num1, num2, num3)));
}
return jsonArray.toJSONString();
}上記のコードでは、Spring MVC を使用します。 Java コードを作成するためのフレームワーク。まず、最大値と最小値を設定します。次に、Math.random() メソッドを使用して 3 つの整数をランダムに生成し、JSONArray オブジェクトに追加します。最後に、JSONArray オブジェクトを文字列に変換し、その逆の変換を行います。
ステップ 3: HTML コードを記述する
次は HTML コードです:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>3D统计图示例</title>
<script src="echarts.min.js"></script>
</head>
<body>
<div id="myChart" style="width: 800px;height:400px;"></div>
<script>
var myChart = echarts.init(document.getElementById('myChart'));
var option = {
title: {
text: '3D统计图示例'
},
tooltip: {},
legend: {
data: ['data1', 'data2', 'data3']
},
xAxis: {
type: 'category',
data: []
},
yAxis: {},
zAxis: {},
grid3D: {},
series: [{
name: 'data1',
type: 'bar3D',
data: []
},{
name: 'data2',
type: 'bar3D',
data: []
},{
name: 'data3',
type: 'bar3D',
data: []
}]
};
myChart.setOption(option);
$.ajax({
url: 'getChartData',
type: 'POST',
success: function (data) {
data = JSON.parse(data);
var xAxisData = data.map(function (item) {
return item[0];
});
var data1 = [], data2 = [], data3 = [];
for(var i = 0; i < data.length; i++) {
data1.push([data[i][0], data[i][1], i]);
data2.push([data[i][0], data[i][2], i]);
data3.push([data[i][0], data[i][3], i]);
}
myChart.setOption({
xAxis: {
data: xAxisData
},
series: [{
data: data1
}, {
data: data2
}, {
data: data3
}]
});
}
});
</script>
</body>
</html>上記のコードでは、ランダムに生成されたデータを取得するために jQuery ライブラリを使用しました。まず、3D グラフを表示するための div 要素を作成しました。次に、echarts.init() メソッドを使用して 3D 統計グラフを初期化し、座標軸や凡例などのいくつかの基本オプションを設定します。次に、$.ajax() メソッドを使用してバックグラウンドからデータを取得し、3D 統計グラフにデータを表示します。
異なるデータ系列を表すために 3 つの異なる色を使用していることにも言及する価値があります。
ステップ 4: プログラムを実行する
最後に、ブラウザで HTML ファイルを開いてプログラムを実行できます。ブラウザ上では美しい3D統計グラフが表示されます。
結論
この記事では、ECharts と Java インターフェイスを使用して美しい 3D 統計グラフを作成する方法を紹介します。まずバックグラウンドからランダムに生成されたデータを取得し、次に EChart を使用してデータを視覚化します。これにより、データをより直感的に理解して分析し、データの美しさを向上させることができます。データ視覚化に興味がある場合は、ECharts と Java インターフェイスを使用して独自のデータ視覚化プログラムを構築してみるのも良いでしょう。
以上がECharts と Java インターフェイスを使用して美しい 3D 統計グラフを作成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
高度なJavaプロジェクト管理、自動化の構築、依存関係の解像度にMavenまたはGradleを使用するにはどうすればよいですか？Mar 17, 2025 pm 05:46 PMこの記事では、Javaプロジェクト管理、自動化の構築、依存関係の解像度にMavenとGradleを使用して、アプローチと最適化戦略を比較して説明します。
適切なバージョン化と依存関係管理を備えたカスタムJavaライブラリ（JARファイル）を作成および使用するにはどうすればよいですか？Mar 17, 2025 pm 05:45 PMこの記事では、MavenやGradleなどのツールを使用して、適切なバージョン化と依存関係管理を使用して、カスタムJavaライブラリ（JARファイル）の作成と使用について説明します。
カフェインやグアバキャッシュなどのライブラリを使用して、Javaアプリケーションにマルチレベルキャッシュを実装するにはどうすればよいですか？Mar 17, 2025 pm 05:44 PMこの記事では、カフェインとグアバキャッシュを使用してJavaでマルチレベルキャッシュを実装してアプリケーションのパフォーマンスを向上させています。セットアップ、統合、パフォーマンスの利点をカバーし、構成と立ち退きポリシー管理Best Pra
キャッシュや怠zyなロードなどの高度な機能を備えたオブジェクトリレーショナルマッピングにJPA（Java Persistence API）を使用するにはどうすればよいですか？Mar 17, 2025 pm 05:43 PMこの記事では、キャッシュや怠zyなロードなどの高度な機能を備えたオブジェクトリレーショナルマッピングにJPAを使用することについて説明します。潜在的な落とし穴を強調しながら、パフォーマンスを最適化するためのセットアップ、エンティティマッピング、およびベストプラクティスをカバーしています。[159文字]
Javaのクラスロードメカニズムは、さまざまなクラスローダーやその委任モデルを含むどのように機能しますか？Mar 17, 2025 pm 05:35 PMJavaのクラスロードには、ブートストラップ、拡張機能、およびアプリケーションクラスローダーを備えた階層システムを使用して、クラスの読み込み、リンク、および初期化が含まれます。親の委任モデルは、コアクラスが最初にロードされ、カスタムクラスのLOAに影響を与えることを保証します
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
AI Hentai Generator
AIヘンタイを無料で生成します。
人気の記事
ホットツール
EditPlus 中国語クラック版
サイズが小さく、構文の強調表示、コード プロンプト機能はサポートされていません
mPDF
mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
Dreamweaver Mac版
ビジュアル Web 開発ツール
