このサイトでは、サイトや広告を改善するために Cookie を使用します。サイトを利用することで、Cookie の使用に同意するものといたします。詳細はプライバシーについてをご覧ください。
LightningChart JS は、トップ パフォーマンスを備えたインタラクティブで印象的なデータ視覚化アプリケーションを作成するためのライブラリです。
LightningChart を使用すれば、開発者は高レベルのコンポーネントを活用して、最小限の作業でフロントエンド アプリケーションに極めて高性能なグラフを埋め込むことができます。
LightningChart JS は、クライアントの GPU を活用して、データ視覚化に必要な重いグラフィックス作業をオフロードします。これにより、他の JavaScript チャート ライブラリと比較して、CPU 使用率が極めて低くなります。
WebGL 2 または WebGL 1 + 以下の拡張機能が必要：
現在、約 99% のブラウザーがこれらの要件を満たしています。webglreport.com でブラウザーの互換性を確認できます。
TypeScript アプリケーションの場合：
Node.js (NPM インストールの場合)：
LightningChart JS は、完全にクライアント デバイス上で動作し、サーバー セットアップなどは必要ありません。パフォーマンスは、主にクライアント ハードウェア (CPU、GPU、RAM) に影響されます。
LightningChart JS は、NPM (Node Package Manager) または CDN サービスからインストールできます。
ステップ 1: Node.js がインストールされていることを確認します。
ステップ 2: 以下のコマンドでインストールします：
npm i @lightningchart/lcjsステップ 3: アプリケーションで使用します：
import { lightningChart } from "@lightningchart/lcjs";
const lc = lightningChart({ license: 'my-license-key' })
const chart = lc.ChartXY()
chart
.addLineSeries()
.appendJSON(dataSet) // { x: number, y: number }[]アプリケーションが Node パッケージを直接使用できない場合は、IIFE ディストリビューションを使用して、事実上任意の Web アプリケーションで LightningChart JS を使用できます。
HTML ファイルに以下を追加：
<script src="https://cdn.jsdelivr.net/npm/@lightningchart/lcjs@8.1.1/dist/lcjs.iife.js"></script>スクリプトで使用：
<script>
const { lightningChart } = lcjs;
const lc = lightningChart({ license: 'my-license-key' })
const chart = lc.ChartXY()
chart
.addLineSeries()
.appendJSON(dataSet)
</script>IIFE ビルドは、jsdelivr などの CDN サービスを介して公開されています。または、NPM から直接ダウンロードして、ローカル アプリケーション アセットとして保存することもできます。
以前のパッケージ名 @arction/lcjs は廃止されました。必ず @lightningchart/lcjs を使用してください。
LightningChart JS を使用するには、ライセンス キーが必要です。これは、体験版キー、開発者キー、または配置キーのいずれかです。
ライセンス取得方法：
配置とインターネット接続： LightningChart JS は、SaaS、パブリック Web サイト、オフライン イントラネット、配布可能デバイス、モバイル アプリケーション、デスクトップ アプリケーションなど、事実上あらゆる種類の環境に配置できます。インターネット接続は、ローカル開発環境で開発者ライセンスを使用する場合にのみ必要です。それ以外の場合、チャートは完全にオフラインで使用できます。
以下は、LightningChart JS を使用した基本的なライン チャートの例です。
import { lightningChart } from "@lightningchart/lcjs";
// ... または IIFE の場合：
// const { lightningChart } = lcjs;
const lc = lightningChart({ license: 'my-license-key' })
const chart = lc.ChartXY()
chart
.addLineSeries()
.appendJSON(dataSet) // { x: number, y: number }[]デフォルトでは、LightningChart は完全にインタラクティブです。上記のチャートでズーム、パン、カーソルの使用を試してください。
画像プレースホルダー 1： 基本的なライン チャートのスクリーンショットをここに挿入
LightningChart JS のインタラクティブ サンプル ギャラリーには、製品ドキュメントや API ドキュメントにある簡単なスニペットよりも現実的なユースケースが含まれています。アプリケーション コードを確認したり、実験したりすることもできます。
インタラクティブ サンプルを参照することは、独自のユースケースに類似する既存のアプリケーションを特定する効果的な方法です。
画像プレースホルダー 2： インタラクティブ サンプル ギャラリーのスクリーンショットをここに挿入
インタラクティブ サンプルには、LightningChart JS のすべての可能なユースケースが含まれているわけではありません。LightningChart JS がお客様のユースケースで機能するかどうかを確認するには、機能ページ をご覧ください。
LightningChart JS は、実質的にあらゆる JavaScript フロントエンド フレームワークで使用できます。
React アプリケーションで使用可能
Vue アプリケーションで使用可能
Angular アプリケーションで使用可能
また、大多数の最新の Web ライブラリと同様に、モバイルおよびデスクトップ フレームワークでも使用できます。これにより、さまざまなプラットフォームで Web コンポーネントを再利用するクロス プラットフォーム ソリューションを開発できます。
LightningChart は、Python や R など、まったく異なるプログラム ランタイムや言語と一緒に使用することもできます。
LightningChart JS は、ユーザー インターフェイスに高性能なデータ視覚化コンポーネントを配置するための JavaScript/TypeScript ライブラリです。WebGL を使用しています。
LightningChart JS には完全な型定義が付属しており、TypeScript での開発時に特に便利です。
@lightningchart/lcjs/dist/lcjs.d.tsライブラリのビルド ファイルは、jsdelivr で確認できます。
画像プレースホルダー 3： TypeScript IntelliSense のスクリーンショットをここに挿入
LightningChart JS のパフォーマンス上の利点は、従来のチャート ソリューションが CPU で実行する重い計算を GPU にオフロードし、データ視覚化の目的で可能な限り最適な方法で低レベルのグラフィック API を直接利用することに基づいています。
主なパフォーマンス上の利点：
包括的な機能ガイドと API ドキュメントを提供します。
実用的な例とコード スニペットを提供します。
お探しの情報が見つからない場合は、公式ドキュメント サイトの右上隅にある検索ボックスを使用してキーワード検索 (例：「Theme」) を試すか、エクセルソフトまでお問い合わせください。