HistogramChart

import { HistogramChart } from "@grassroot/charts-react";
 
<HistogramChart values={[3, 4, 4, 6, 8, 9, 12, 14, 14, 18]} />

<script setup lang="ts">
import { HistogramChart } from "@grassroot/charts-vue";
</script>
 
<template>
  <HistogramChart :values='[3, 4, 4, 6, 8, 9, 12, 14, 14, 18]' />
</template>

import { ChangeDetectionStrategy, Component } from "@angular/core";
import { GrassrootHistogramChart } from "@grassroot/charts-angular";
 
@Component({
  selector: "app-histogram-chart-chart-demo",
  standalone: true,
  imports: [GrassrootHistogramChart],
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `<grassroot-histogram-chart [values]='[3, 4, 4, 6, 8, 9, 12, 14, 14, 18]' />`,
})
export class HistogramChartDemoComponent {
 
}
 
export default HistogramChartDemoComponent;

<script lang="ts">
  import { HistogramChart } from "@grassroot/charts-svelte";
</script>
 
<HistogramChart values={[3, 4, 4, 6, 8, 9, 12, 14, 14, 18]} />

/** @jsxImportSource solid-js */
import { HistogramChart } from "@grassroot/charts-solid";
 
export default function HistogramChartDemo() {
  return <HistogramChart values={[3, 4, 4, 6, 8, 9, 12, 14, 14, 18]} />;
}