@unovis/solid NPM

cover

🟨 Unovis is a modular data visualization framework for React, Angular, Svelte, Vue, Solid and vanilla TypeScript or JavaScript.

@unovis/solid provides Solid components for @unovis/ts, which makes Unovis integration into a Solid app much easier.

Learn more about Unovis on our website unovis.dev

Installation

npm install -P @unovis/ts @unovis/solid

Quick Start

TypeScript

import { VisXYContainer, VisLine, VisAxis } from '@unovis/solid'

type DataRecord = { x: number; y: number }
const data: DataRecord[] = [
  { x: 0, y: 0 },
  { x: 1, y: 2 },
  { x: 2, y: 1 },
]

const BasicLineChart = () => {
  return (
    <VisXYContainer height='50dvh'>
      <VisLine data={data} x={(d) => d.x} y={(d) => d.y} />
      <VisAxis type='x' />
      <VisAxis type='y' />
    </VisXYContainer>
  )
}

export default BasicLineChart