chart-ssb v1.0.19

This library is create Line chart by ChartJS, react-chartjs-2

Support PointElement,LineElement,BarElement,

Getting started

npm i chart-ssb

or

yarn add chart-ssb

How to use

ReactJS

import { ChartSSB } from "chart-ssb"

NextJS

import dynamic from "next/dynamic";
const ChartSSB = dynamic(() => import('chart-ssb').then((mod) => mod.ChartSSB), {ssr: false});

Example

<div style={{ width: "100%", height: "500px", position: "relative" }}>
    <ChartSSB
      type={"line"}
      title={"Test Title"}
      showTitle={false}
      label={"Test Label"}
      showLabel={false}
      tooltipLabel={"฿"}
      tooltipBackground={"#0c5ae5"}
      xAxisData={newX}
      yAxisData={newY}
      pointSize={4}
      pointColor={"#0C5AE5"}
      borderSize={3}
      lineColor={"#0C5AE5"}
      fill={true}
      fillHeight={500}
      fillStart={"rgba(12, 90, 229, 0.30)"}
      fillStop={"rgba(12, 90, 229, 0.0)"}
      tension={0.4}
      offset={true}
      stepSizeY={20}
      gridXDisplay={false}
      gridYDisplay={false}
      xLabelDisplay={true}
      yLabelDisplay={true}
      scroll={scroll}
      maxScreen={MAX_SCREEN}
      maxHeight={"500px"}
      tickXdisplay={scalesX}
      totalXlength={total_X_LENGTH}
      prevArrowStyle={{}}
      nextArrowStyle={{}}
    />
</div>

Attribute