React Charts - Web およびモバイル向けリアルタイムデータグラフ
- 50以上のChartsタイプ
- 稲妻のような高速パフォーマンス
- エレガントなアニメーション
- シンプルな設定とAPI
- すべての最新ブラウザをサポート
- モバイルフレンドリーでレスポンシブ
- 詳細なドキュメント
Trusted by the world’s leading companies
概要
React Charts は、モバイルおよびWebアプリケーションの両方でデータを視覚化するための精巧に作られたChartsコンポーネントです。線グラフから金融グラフまで、すべてのCharts作成シナリオに対応する50以上のChartsとグラフの豊富なUIギャラリーが含まれています。その高いパフォーマンスにより、パフォーマンスの問題なしに大量のデータを素早くレンダリングできます。Syncfusion React Charts を使用することで、ズーム、パン、ツールチップ、クロスヘア、トラックボール、ハイライト、選択などの豊富な機能セットを備えたレスポンシブでインタラクティブなChartsとグラフを作成できます。
なぜSyncfusion React Charts を選ぶのか？
50以上のChartsタイプ
線グラフ、棒グラフ、エリアグラフなどのシンプルな日常的なChartsから、高度にカスタマイズ可能な複雑な金融Chartsまで対応。
Chartsアニメーション
React用Chartsは、スムーズな遷移でデータを表現する流動的なアニメーションを提供します。
パフォーマンス
高速パフォーマンスに重点を置いた十分に検討された取り組みにより、10万件のデータを1秒以内にレンダリングできます。
SVGレンダリング
すべてのレスポンシブおよびスケーリングニーズに対応するベクターベースのクリーンで鮮明なレンダリング。
データ編集
豊富なUIを持つReact Charts は、レンダリングされたポイントへのドラッグ&ドロップサポートを提供します。データ編集により、Charts上のデータを操作できます。
トレンドライン
価格の方向と動きの速度を表示します。トレンドラインは、棒グラフを除くカルテシアンタイプのシリーズ（線、列、散布、エリア、キャンドル、HiLo など）に対して生成できます。
グローバル化とローカライゼーション
異なるロケールのユーザーが、日付、通貨、番号付けを好みに合わせてフォーマットして使用できるようにします。
エクスポート
グラフをPDFドキュメントやSVG、PNG、JPEGなどの画像形式にエクスポートし、ChartsデータをXLSXやCSV形式にもエクスポートできます。
あなたのビジネスのための強力で使いやすく機能豊富なReact Charts
React Charts コード例
以下に示すような数行のHTMLとJavaScriptコード例を使用してReact Charts を簡単に開始できます。また、ReactでChartsをレンダリングおよび構成する方法を示すReact Charts Example もご確認ください。
<!DOCTYPE html>
<html>
<body>
<div id="charts"></div>
</body>
</html>import { AxisModel, Category, ChartComponent, Inject, LineSeries, SeriesCollectionDirective, SeriesDirective} from'@syncfusion/ej2-react-charts';
import * as React from 'react';
class App extends React.Component<{}, {}> {
public primaryXAxis: AxisModel = { valueType: 'Category'};
public data : any[]= [{ x: 'WW', y: 38.3, text: 'World Wide' },
{ x: 'EU', y: 45.2, text: 'Europe' },
{ x: 'APAC', y: 18.2, text: 'Asia Pacific' },
{ x: 'LATAM', y: 46.7, text: 'Latin America' },
{ x: 'MEA', y: 61.5, text: 'Middle East Africa' },
{ x: 'NA', y: 64, text: 'North America' }];
public render() {
return <ChartComponent id='charts' primaryXAxis={this.primaryXAxis}>
<Inject services={[LineSeries, Category]} />
<SeriesCollectionDirective>
<SeriesDirective dataSource={this.data} xName='x' yName='y' type='Line'/>
</SeriesCollectionDirective>
</ChartComponent>
}
};
ReactDOM.render(
<App />,
document.getElementById('charts') as HTMLElement
);
モバイルファーストアプローチ
単一のコードベースでReact Charts を開発し、あらゆるWeb、モバイル、タブレット環境に適応する十分に考慮されたモバイル適応アーキテクチャ。モバイルデバイス内で美しく、レスポンシブで、インタラクティブ、アニメーション化されたChartsをレンダリングします。
アクセシビリティ
キーボードナビゲーション
すべての要素がキーボードでアクセス可能であることを保証します。選択、ハイライト、ツールチップ、レジェンドの折りたたみ、ズームとパンなどの主要な機能は、キーボードコマンドのみで実行できます。マウスの操作は必要ありません。これにより、このReact Charts コンポーネントを使用して高いアクセシビリティを持つアプリケーションを作成できます。
スクリーンリーダー
React Charts ビューは完全なWAI-ARIAアクセシビリティサポートを持っています。このUIには高コントラストな視覚要素が含まれており、視覚障害のある人が最高の表示体験を得られるようになっています。また、有効なUIの説明は、スクリーンリーダーなどの支援技術を通じて簡単にアクセスできます。
右から左（RTL）
右から左レンダリングにより、React Charts のテキストとレイアウトを右から左に表示できます。これにより、RTL言語のユーザーエクスペリエンスとアクセシビリティが向上します。
ビジネスに役立つ可能性のあるその他のデータ視覚化コンポーネント。
よくある質問
なぜSyncfusion React Charts を選ぶべきなのでしょうか？
最も要求の厳しいデータ視覚化を強力にサポートするために、以下の機能を持つSyncfusion React Charts を使用してください：
50以上のChartsタイプとエレガントなアニメーションをサポート。
React アプリでの驚異的な高速読み込み時間と豊富なUIインタラクション。
SVGとCanvasの両方のレンダリングをサポート（高速レンダリング用）。
注釈オプションを使用してChartsにカスタム要素を追加できます。
複数のChartsにデータを表示する際、同期Chartsはツールチップ、クロスヘア、選択、ズーム機能をすべてのChartsで調整することで視覚化を強化します。
JSON、RESTfulサービス、ODataサービス、WCFサービスなどのローカルおよびリモートデータソースの使用をサポートする柔軟なデータバインディング。
- ソフトウェアとやり取りするための機能豊富なUIを提供する市場最高のReact Charts の一つ。
シンプルな設定とAPI。
- すべての最新ブラウザをサポート。
- モバイルタッチフレンドリーでレスポンシブ。
Syncfusion React Charts の価格はいくらですか？
React Charts は個別に販売していません。Syncfusion チームライセンスの一部としてのみ購入できます。これには、React Charts を含む 以上のコンポーネントとフレームワークが含まれています。チームライセンスの価格は、5人の開発者で月額$395から始まり、サブスクリプションが期限切れになるまでサポートと更新が含まれます。さらに、現在有効なプロモーションに基づいて割引を提供する場合があります。追加割引の対象となるかどうかについては、今すぐ製品スペシャリストにお問い合わせください。
Syncfusion React Charts デモはどこで見つけられますか？
Charts のレンダリングと設定方法を実演するReact Charts デモをご確認いただけます。
Syncfusion React Charts コンポーネントを個別に購入できますか？
いいえ、React Charts を含む 以上のコンポーネントとフレームワーク（Web、モバイル、デスクトップ向け）は個別に販売されていません。チームライセンスの一部としてのみ利用可能です。ただし、当社では競合他社がChartsコンポーネント単体で請求する金額と少しだけ多い程度の競争力のある価格設定を行っています。また、経験上、お客様は通常、当社の製品の1つを使用し始めてから、すぐに複数の製品に拡張することが多いため、5人の開発者チームで月額$395から始まるサブスクリプション料金で全 以上のコンポーネントとフレームワークを提供することが最良だと感じました。さらに、現在有効なプロモーションに基づいて割引を提供できる場合があります。追加割引の対象となるかどうかについては、今すぐ製品スペシャリストにお問い合わせください。
Syncfusion React Charts を無料でダウンロードして利用できますか？
いいえ、これは商用製品であり、有料ライセンスが必要です。ただし、年間総収益が100万米ドル未満で、開発者が5人以下の企業および個人には、無料コミュニティライセンスも利用できます。
Syncfusion React Charts を始めるにはどうすればよいですか？
包括的なはじめにドキュメントから始めることをお勧めします。
お客様は私たちを愛しています
実際の成功事例を見る
世界中の開発者が複雑なプロジェクトを簡素化し、納期を短縮するために Syncfusion の Essential Studio を信頼しています。豊富な UI コントロール ライブラリ、強力な SDK、信頼できるサポートにより、Essential Studio はチームがエンタープライズ対応のアプリケーションを自信を持って構築できるよう支援します。
ケーススタディを探る産業
ソフトウェア開発
75% コスト削減
50% より迅速な開発
産業
公益事業 (石油・ガス)
450+ 節約された時間
プロセスを合理化し、開発工数を大幅に削減
高度で柔軟な機能
強力で多用途な機能によりユーザーを支援
産業
ソフトウェアと技術
1000+ 節約された時間
エンタープライズ対応の UI コンポーネントで開発を加速
効率的なファイル管理
ドキュメント ライブラリにより、ゼロから構築することなくワークフローを合理化
産業
ソフトウェアと技術
2年 回避された遅延
プロアクティブな計画により 2 年間の遅延を防止
予定どおりの納品
信頼性の高いコントロールを使用してプロジェクトを期日どおりに納品
産業
ITサービスとITコンサルティング
パフォーマンスの向上
大規模データセットを簡単なカスタマイズと迅速なデバッグで処理
高いカスタマイズ性
プラグアンドプレイ方式のコントロールによりテンプレートを素早く統合
産業
プロフェッショナルサービス
即時アクセス
機能とリソースをすぐに利用可能
依存関係の削減
開発を高速化するための依存関係を最小限に
世界中のユーザーからの評価
受賞歴
偉大さ—自分で言うのではなく、他の人が認めるからこそ意味があります。 シンクフュージョンは以下の賞をいただきました。
React Charts ブログとチュートリアルの最近の活動
React Charts ブログとチュートリアルビデオの投稿は、React コンポーネントで最初のアプリを構築する際にガイドします。問題解決戦略を提供し、機能や機能性を説明し、新機能リリースを発表し、ベストプラクティスを説明し、サンプルシナリオを紹介します。React Charts の更新について、ブログとチュートリアルビデオチャンネルの最新投稿をご確認ください。
