CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-10-03 19:43:32 +13:00
Code Issues Projects Releases Wiki Activity

Improve chart robustness even more

Browse source
This commit is contained in:
Andrew Kingston 2020-11-04 14:21:48 +00:00
parent 7aa8d7870d
commit eb446a06af
3 changed files with 29 additions and 52 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
packages/standard-components/src/Chart/BarChart.svelte
View file

@ -1,7 +1,6 @@
<script>
import { onMount } from "svelte"
import fetchData, { fetchSchema } from "../fetchData"
import { sortBy } from "lodash/fp"
import { ApexOptionsBuilder } from "./ApexOptionsBuilder"
import ApexChart from "./ApexChart.svelte"
@ -30,25 +29,19 @@
return
}
const result = (await fetchData(datasource, $store)).slice(0, 20)
const data = sortBy(row => row[labelColumn])(result)
// Fetch, filter and sort data
const schema = await fetchSchema(datasource.tableId)
if (!schema || !data || !data.length) {
const result = await fetchData(datasource, $store)
const reducer = row => (valid, column) => valid && row[column] != null
const hasAllValues = row => valueColumns.reduce(reducer(row), true)
const data = result
.filter(row => row[labelColumn] != null && hasAllValues(row))
.slice(0, 20)
.sort((a, b) => (a[labelColumn] > b[labelColumn] ? 1 : -1))
if (!schema || !data.length) {
return
}
// Check columns are valid
if (datasource.type !== "view") {
if (schema[labelColumn] == null) {
return
}
for (let i = 0; i < valueColumns.length; i++) {
if (schema[valueColumns[i]] == null) {
return
}
}
}
// Initialise default chart
let builder = new ApexOptionsBuilder()
.type("bar")
@ -81,7 +74,7 @@
}),
}))
builder = builder.series(series)
if (!useDates && data[0][labelColumn] != null) {
if (!useDates) {
builder = builder.categories(data.map(row => row[labelColumn]))
}

27
packages/standard-components/src/Chart/LineChart.svelte
View file

@ -1,7 +1,6 @@
<script>
import { onMount } from "svelte"
import fetchData, { fetchSchema } from "../fetchData"
import { sortBy } from "lodash/fp"
import { ApexOptionsBuilder } from "./ApexOptionsBuilder"
import ApexChart from "./ApexChart.svelte"
@ -36,25 +35,19 @@
return
}
const result = (await fetchData(datasource, $store)).slice(0, 100)
const data = sortBy(row => row[labelColumn])(result)
// Fetch, filter and sort data
const schema = await fetchSchema(datasource.tableId)
if (!schema || !data || !data.length) {
const result = await fetchData(datasource, $store)
const reducer = row => (valid, column) => valid && row[column] != null
const hasAllValues = row => valueColumns.reduce(reducer(row), true)
const data = result
.filter(row => row[labelColumn] != null && hasAllValues(row))
.slice(0, 100)
.sort((a, b) => (a[labelColumn] > b[labelColumn] ? 1 : -1))
if (!schema || !data.length) {
return
}
// Check columns are valid
if (datasource.type !== "view") {
if (schema[labelColumn] == null) {
return
}
for (let i = 0; i < valueColumns.length; i++) {
if (schema[valueColumns[i]] == null) {
return
}
}
}
// Initialise default chart
let builder = new ApexOptionsBuilder()
.title(title)
@ -89,7 +82,7 @@
}),
}))
builder = builder.series(series)
if (!useDates && schema[labelColumn]) {
if (!useDates) {
builder = builder.categories(data.map(row => row[labelColumn]))
}

27
packages/standard-components/src/Chart/PieChart.svelte
View file

@ -1,7 +1,6 @@
<script>
import { onMount } from "svelte"
import fetchData, { fetchSchema } from "../fetchData"
import { sortBy } from "lodash/fp"
import { ApexOptionsBuilder } from "./ApexOptionsBuilder"
import ApexChart from "./ApexChart.svelte"
@ -27,23 +26,17 @@
return
}
const result = (await fetchData(datasource, $store)).slice(0, 20)
const data = sortBy(row => row[labelColumn])(result)
// Fetch, filter and sort data
const schema = await fetchSchema(datasource.tableId)
if (!schema || !data || !data.length) {
const result = await fetchData(datasource, $store)
const data = result
.filter(row => row[labelColumn] != null && row[valueColumn] != null)
.slice(0, 20)
.sort((a, b) => (a[labelColumn] > b[labelColumn] ? 1 : -1))
if (!schema || !data.length) {
return
}
// Check columns are valid
if (datasource.type !== "view") {
if (schema[labelColumn] == null) {
return
}
if (schema[valueColumn] == null) {
return
}
}
// Initialise default chart
let builder = new ApexOptionsBuilder()
.title(title)
@ -57,10 +50,8 @@
// Add data if valid datasource
const series = data.map(row => parseFloat(row[valueColumn]))
builder = builder.series(series)
if (data[0][labelColumn] != null) {
builder = builder.labels(data.map(row => row[labelColumn]))
}
const labels = data.map(row => row[labelColumn])
builder = builder.series(series).labels(labels)
// Build chart options
options = builder.getOptions()