按下 Enter 開始編輯
按下 Enter 開始編輯
按下 Enter 開始編輯
AreaChartFillByValue
若要在區域中顯示多種顏色,您可以指定漸層來填滿區域(相同的方法可以應用於其他 SVG 元件)。
您可以將此漸層定義作為 <LineChart />
的子元素傳遞,並使用 sx
覆寫區域 fill
屬性。為此,您需要使用 <linearGradient />
和 <stop />
SVG 元素。
第一步是取得 SVG 的總高度。這可以使用 useDrawingArea
Hook 完成。將 <linearGradient />
定義為從 SVG 容器頂部到底部的向量非常有用。
然後為了定義漸層應從一種顏色切換到另一種顏色的位置,您可以使用 useYScale
Hook 來取得值 0 的 y 座標。
API
請參閱以下文件,以取得此處提及之元件的所有 props 和 classes 的完整參考。