VoronoiOverlay

import { VoronoiOverlay } from "@grassroot/charts-react";
 
<VoronoiOverlay points={[{ id: "a", x: 86, y: 74 }, { id: "b", x: 172, y: 130 }, { id: "c", x: 250, y: 72 }]} width={360} height={220} />

<script setup lang="ts">
import { VoronoiOverlay } from "@grassroot/charts-vue";
</script>
 
<template>
  <VoronoiOverlay :points='[{ id: "a", x: 86, y: 74 }, { id: "b", x: 172, y: 130 }, { id: "c", x: 250, y: 72 }]' :width='360' :height='220' />
</template>

import { ChangeDetectionStrategy, Component } from "@angular/core";
import { GrassrootVoronoiOverlay } from "@grassroot/charts-angular";
 
@Component({
  selector: "app-voronoi-overlay-chart-demo",
  standalone: true,
  imports: [GrassrootVoronoiOverlay],
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `<grassroot-voronoi-overlay [points]='[{ id: "a", x: 86, y: 74 }, { id: "b", x: 172, y: 130 }, { id: "c", x: 250, y: 72 }]' [width]='360' [height]='220' />`,
})
export class VoronoiOverlayDemoComponent {
 
}
 
export default VoronoiOverlayDemoComponent;

<script lang="ts">
  import { VoronoiOverlay } from "@grassroot/charts-svelte";
</script>
 
<VoronoiOverlay points={[{ id: "a", x: 86, y: 74 }, { id: "b", x: 172, y: 130 }, { id: "c", x: 250, y: 72 }]} width={360} height={220} />

/** @jsxImportSource solid-js */
import { VoronoiOverlay } from "@grassroot/charts-solid";
 
export default function VoronoiOverlayDemo() {
  return <VoronoiOverlay points={[{ id: "a", x: 86, y: 74 }, { id: "b", x: 172, y: 130 }, { id: "c", x: 250, y: 72 }]} width={360} height={220} />;
}