Hacktoberfest 2026：メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Move the small charts to Chart.js and drop ApexCharts

オープン
  • 何か問題がありますか？
#926 コメント 0 件 リアクション 0 件 担当者 1 名 GitHub で見る

メンテナーはふだん 2 日以内に返信

@bracyw がすでに取り組んでいます。

2026年10月27日 から。

  • #939 @bracyw による — オープン

評価

この issue はまだ評価されていません。

説明

by: ai dev work frontend
What

Move the client's other charts (the shared line graph, the double-line graph and the pie chart) from ApexCharts to Chart.js, then remove ApexCharts from the client. They appear in the graph dialog, info graph, acceleration graphs, the charging page and motor info.

Requirements
  • The line graphs in the graph dialog, info graph, acceleration graphs and the charging page's cell temperature and pack voltage draw with Chart.js and update live
  • The charging page's high/low cell graph shows both lines with its legend
  • The motor info pie chart draws with Chart.js, with its legend
  • apexcharts and ng-apexcharts are removed from angular-client
Notes
  • Builds on the Chart.js setup from #925; removing ApexCharts needs #925 merged first.
  • Spike #877, draft PR #887; decision: https://github.com/Northeastern-Electric-Racing/Argos/issues/865#issuecomment-6430776779
  • Dropped approaches: uPlot (#872) and webgl-plot (#878) have no pie chart; dygraphs (#876), lightweight-charts (#875) and Plotly (#874) were dropped for the graph page (too little built in, no legend, double the memory), and ECharts (#873) for about 100 MB more memory.
Context transfer
SUMMARY
Three ApexCharts components remain after the graph page moves: graph-component, double-line-graph and pie-chart, under angular-client/src/components/.

CONTEXT
- graph-component (components/graph/graph.component.ts, 190 lines): one line series, toolbar hidden, zoom with autoScaleYaxis, linear y, tooltip. Used in components/graph-dialog, components/info-graph, components/acceleration-graphs, pages/charging-page/components/cell-temp/cell-temp-graph, pages/charging-page/components/pack-voltage/pack-voltage-graph. Its options are applied only at chart creation; a later colour change isn't pushed.
- double-line-graph (components/double-line-graph/double-line-graph.component.ts, 196 lines): two line series with a legend. Used in pages/charging-page/components/high-low-cell/high-low-cell-graph. It calls updateOptions rather than updateSeries, because apexcharts 5's updateSeries replots lines without redrawing the axes or legend.
- pie-chart (components/pie-chart/pie-chart.component.ts, 90 lines): pie with a legend. Used in components/motor-info.
- The graph page registers only line-chart parts in its own providers; a pie chart needs PieController and ArcElement registered.
- Each component has a spec that references ApexCharts.
- Graph page CSS on develop also references ApexCharts classes (pages/graph-page/graph-page.component.css, graph/graph.component.css); the graph page ticket removes those.
主要言語
TypeScript
スター
5
フォーク
1
平均マージ
2日 13時間
マージ済み PR（30日）
48

環境構築

  • Dockerfile・Docker Compose ファイルなし
  • プルリクエストのテンプレートあり
  • コントリビューションガイドなし

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

Northeastern-Electric-Racing/Argos のほかの issue

Northeastern-Electric-Racing/Argos の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。