DocsChartsPrimitives
Drag
React example follows below.
ts
import { Drag } from "@grassroot/charts-react"; <Drag aria-label="Drag capture layer" />ts
<script setup lang="ts">import { Drag } from "@grassroot/charts-vue";</script> <template> <Drag aria-label="Drag capture layer" /></template>ts
import { ChangeDetectionStrategy, Component } from "@angular/core";import { GrassrootDrag } from "@grassroot/charts-angular"; @Component({ selector: "app-drag-chart-demo", standalone: true, imports: [GrassrootDrag], changeDetection: ChangeDetectionStrategy.OnPush, template: `<grassroot-drag aria-label="Drag capture layer" />`,})export class DragDemoComponent { } export default DragDemoComponent;ts
<script lang="ts"> import { Drag } from "@grassroot/charts-svelte";</script> <Drag aria-label="Drag capture layer" />ts
/** @jsxImportSource solid-js */import { Drag } from "@grassroot/charts-solid"; export default function DragDemo() { return <Drag aria-label="Drag capture layer" />;}Installation
bash
pnpm dlx grassroot add chart/dragbash
npx grassroot@latest add chart/dragbash
yarn dlx grassroot add chart/dragbash
bunx grassroot add chart/dragAPI Reference
| Prop | Type | Default |
|---|---|---|
onDragMove | ((point: { x: number; y: number; }) => void) | undefined | — |