Pack and unpack tabular dataLocation InputForeignObject exporting issueConvert observable code to normal JavascriptPersistent Select InputContinent SelectorInputs in gridGroupBy we deserve 🦇Matrix InputFetcher usageComments on notebooksData driven range slidersObservableHQ built in datasetsStylesFetcherUtilsInstant Data Visualizer
Utils Usage
import {dependencies} from "@bumbeishvili/utils"
dependencies
import {continentSelector} from "@bumbeishvili/utils"
viewof continent = continentSelector()
continent
import {group} from "@bumbeishvili/utils"
groupByData = require("@observablehq/cars")
group(groupByData)
.by(d=>d.Year, d=>d.Cylinders)
.run()
import {tablefy} from "@bumbeishvili/utils"
tableData = [{a:1,b:2,c:3,k:8,k:0},{a:2,c:3,}] // first row must contain all columns
tablefy(tableData)
import {rangeSlider} from "@bumbeishvili/utils"
rangeSliderData = [...Array(500)]
.map((d,i)=>Math.random()*500)
.map(d=>Math.round(d))
viewof range = rangeSlider(rangeSliderData,d=>d)
range
comments(true)
import {inputsGrid} from "@bumbeishvili/utils"
import {slider,select} from "@jashkenas/inputs"
viewof values = inputsGrid([
[
slider({'title':'test',name:'name',description:'description'}),
slider({'title':'test',name:'name',description:'description'}),
slider({'title':'test',name:'name',description:'description'}),
],
[
slider({'title':'test',name:'name',description:'description'}),
slider({'title':'test',name:'name',description:'description'}),
slider({'title':'test',name:'name',description:'description'}),
],
[
`<div style="height:50px;width:${width/2-100}px"></div>`, // Just a trick, to make select element centered
select(['test','name']),
]
])
import {persistentSelect} from "@bumbeishvili/utils"
persistentSelect([1,2,3,4],'key')
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
