Docs
Hooks
useConnect

useConnect

Hook to connect interaction of multiple chart series.

Usage

import { useConnect, EChart } from '@kbox-labs/react-echarts'
 
function App() {
  const [isConnected, setIsConnected] = useConnect('group1')
 
  return (
    <div>
      <EChart
        group='group1'
        // ...rest of props
      />
      <EChart
        group='group1'
        // ...rest of props
      />
      <button onClick={() => setIsConnected(!isConnected)}>
        {isConnected ? 'Disconnect' : 'Connect'}
      </button>
    </div>
  )
}

API

const useConnect: (group: string) => [boolean | ((connected: boolean) => void)]

Parameters

PropDescriptionTypeDefault
groupGroup name to be used in chart connection.stringundefined
isConnectedControl whether the group is connected or notbooleanfalse