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 投稿