EChartsのrenderItemカスタムチャートにおける残像問題の解決方法

ある企業では、従業員のシフトスケジュールを表示するガント図の作成が必要でした。大量のカスタム要素と複雑なインタラクションを扱うため、初期版ではDOMと仮想リスト(Virtual List)を組み合わせたアプローチを採用しました。表示とインタラクションの両方で良好な結果を得られましたが、データ量が増えると、仮想リストであってもスクロール時にカクつきが発生するよ ...

6月15日 22:14 投稿

Reactフックを使用したEChartsのカスタムフック実装

EChartsはデータ可視化において非常に強力なライブラリですが、複数回使用する際に共通するコードが増える傾向があります。このような繰り返し処理を効率化するために、Reactのフックを活用してEChartsの初期化処理をカプセル化します。 カスタムフックの構成要素 このカスタムフックでは、以下の要素を扱う必要があります: HTML要素(EChartsを描画するため ...

5月28日 01:58 投稿

Spring Boot 3とVue 3を用いたフロントエンド・バックエンド分離プロジェクトでのECharts統合

2、バックエンド実装 2.1 月間販売数量 @Operation(summary = "製品別月間販売数量の統計") @PostMapping("/monthlySales") public SaResult monthlySales(@RequestBody DateRangeDTO dateRangeDTO){ LocalDate startDate = LocalDate.parse(dateRangeDTO.getStartDate(), DateTimeFormatter.ofPattern("yyyy-MM-dd")); ...

5月14日 23:48 投稿