

React,TypeScriptで以下のサンプルのように1つの時系列に複数のグラフを表示し、値を確認したり範囲を指定した操作ができるグラフを作りたいと考えています。  
<https://software.es.net/react-timeseries-charts/#/example/cycling>  
<https://software.es.net/react-timeseries-charts/#/example/traffic>

Rechart等を見た限り望んだ機能が見つからず、サンプルのreact-timeseries-chartsを使おうとしています。  
しかし数年前のライブラリのようで、TypeScriptで使用するには型周りで問題が起きています。

CodeSandBoxでサンプルコードを書いてみました。  
<https://codesandbox.io/s/react-timeseries-charts-barsample-
zvpggt?file=/src/App.tsx>  
CodeSandBoxでは表示まで出来ていますが、ローカルのプロジェクトでは警告が出ている箇所でエラー表示となります。警告が出るのが以下の三点です。  
1．impotr時に"react-timeseries-charts"に型定義が無い  
2．Index.getIndexString("1h", new Date(d))の引数が0個と定義されたところに2個ある  
3．series.range()にtypeは無い

1は適当な型定義ファイルを作ることで全てanyとしては使えるようになりました。  
3はtimerange()という同等の関数が定義されていたので置き換えできました。

2が問題で、pondjsにIndexの型定義ファイルは有るものの、それが実際の使用方法と合っていないようです。他のサンプルでも同じ問題があり試せないコードがあります。  
こういう場合の対処法は何かあるのでしょうか。最近TypeScriptに触れたので根本的なところで見落しがあるかもしれません。


CC BY-SA 4.0
2023-08-10T02:50:55.460
95907
2023-08-10T02:50:55.460
57530
question
reactjs typescript
react,typescriptで型定義が誤っている?ライブラリを使用する方法