Update candlestick chart to be reactive

This commit is contained in:
Andrew Kingston 2022-03-22 17:44:45 +00:00
parent fbebc8aced
commit e1aea10567
1 changed files with 36 additions and 5 deletions

View File

@ -16,17 +16,48 @@
export let animate
export let yAxisUnits
$: options = setUpChart(dataProvider)
$: options = setUpChart(
title,
dataProvider,
dateColumn,
openColumn,
highColumn,
lowColumn,
closeColumn,
xAxisLabel,
yAxisLabel,
height,
width,
animate,
yAxisUnits
)
// Fetch data on mount
const setUpChart = provider => {
const setUpChart = (
title,
dataProvider,
dateColumn,
openColumn,
highColumn,
lowColumn,
closeColumn,
xAxisLabel,
yAxisLabel,
height,
width,
animate,
yAxisUnits
) => {
const allCols = [dateColumn, openColumn, highColumn, lowColumn, closeColumn]
if (!provider || !provider.rows?.length || allCols.find(x => x == null)) {
if (
!dataProvider ||
!dataProvider.rows?.length ||
allCols.find(x => x == null)
) {
return null
}
// Fetch data
const { schema, rows } = provider
const { schema, rows } = dataProvider
const reducer = row => (valid, column) => valid && row[column] != null
const hasAllColumns = row => allCols.reduce(reducer(row), true)
const data = rows.filter(row => hasAllColumns(row))