GlyphPlotChart

import { GlyphPlotChart } from "@grassroot/charts-react";
 
<GlyphPlotChart points={[{ x: 1, y: 2 }, { x: 2, y: 5, glyph: "triangle" }]} />

<script setup lang="ts">
import { GlyphPlotChart } from "@grassroot/charts-vue";
</script>
 
<template>
  <GlyphPlotChart :points='[{ x: 1, y: 2 }, { x: 2, y: 5, glyph: "triangle" }]' />
</template>

import { ChangeDetectionStrategy, Component } from "@angular/core";
import { GrassrootGlyphPlotChart } from "@grassroot/charts-angular";
 
@Component({
  selector: "app-glyph-plot-chart-chart-demo",
  standalone: true,
  imports: [GrassrootGlyphPlotChart],
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `<grassroot-glyph-plot-chart [points]='[{ x: 1, y: 2 }, { x: 2, y: 5, glyph: "triangle" }]' />`,
})
export class GlyphPlotChartDemoComponent {
 
}
 
export default GlyphPlotChartDemoComponent;

<script lang="ts">
  import { GlyphPlotChart } from "@grassroot/charts-svelte";
</script>
 
<GlyphPlotChart points={[{ x: 1, y: 2 }, { x: 2, y: 5, glyph: "triangle" }]} />

/** @jsxImportSource solid-js */
import { GlyphPlotChart } from "@grassroot/charts-solid";
 
export default function GlyphPlotChartDemo() {
  return <GlyphPlotChart points={[{ x: 1, y: 2 }, { x: 2, y: 5, glyph: "triangle" }]} />;
}