Aioros.Pictor · Aioros

Aioros.Pictor · XAML の Recharts

Recharts のグラフを、JavaScript を書かずに

Recharts 2.15.4 の API 全体を XAML で。サーバーが SVG として書き出し、CSS とフレームワークのスクリプトで操作でき、サーバーが新しいデータを送るとライブで更新され、デスクトップではネイティブに描画されます。

このサーバーからライブでリポジトリ

種類のグラフ、Recharts のすべてのエクスポート

96×

Recharts のサーバーレンダリングより高速

2.15.4

API を踏襲する Recharts のバージョン

測定方法

Recharts の各サンプルを Recharts と Pictor の両方でレンダリングして比較しています。サーバー計測はラボのランナーで同じサンプルを書き出し、Pictor の SVG と Recharts の renderToStaticMarkup を同じ 4 コアで比べたものです（Pictor リポジトリの docs/benchmarks.md、第 12 回）。

このサーバーからライブで

以下のサンプルはすべて、いま読んでいるサーバーがレンダリングした XAML です。同じ XAML がデスクトップでもネイティブに動きます。

折れ線

エリア

棒

複合

散布図

円

レーダー

放射状の棒

ファネル

ツリーマップ

サンキー

サンバースト

XAML

Pages/traffic/Page.axaml

<p:AreaChart Data="{Binding Visits}"> <p:CartesianGrid StrokeDashArray="3 3" /> <p:XAxis DataKey="Month" /> <p:YAxis /> <p:Tooltip /> <p:Area Type="Monotone" DataKey="Web" Fill="{DynamicResource PictorPalette1}" /> </p:AreaChart>

エコシステムのほかのライブラリ

Aioros.Cosmo · XAML の shadcn/ui

shadcn/ui のすべてのコンポーネントを XAML で

Cosmo を見る

Aioros.Graphs · C# の d3

d3 の描画エンジンを、バイト単位で

Graphs を見る