#사용자 정의 상호작용 이벤트

chart.off('click');
chart.on('click', (params) => {
  const { seriesIndex, dataIndex } = params;
  // 현재 데이터 포인트 강조
  chart.dispatchAction({ type: 'highlight', seriesIndex, dataIndex });
  // 다른 강조 해제
  chart.dispatchAction({ type: 'downplay', seriesIndex });
});

chart.off('click');
chart.on('click', (params) => {
  const order_date = params.data[0]
  
  // 방법 1: 전체 페이지 새로고침 없이 애플리케이션 내부에서 이동 (권장). 상대 경로만 필요합니다.
  ctx.router.navigate(`/new-path/orders?order_date=${order_date}`)

  // 방법 2: 외부 페이지로 이동. 전체 URL이 필요합니다.
  window.location.href = `https://www.host.com/new-path/orders?order_date=${order_date}`

  // 방법 3: 새 탭에서 외부 페이지 열기. 전체 URL이 필요합니다.
  window.open(`https://www.host.com/new-path/orders?order_date=${order_date}`)
});

chart.off('click');
chart.on('click', (params) => {
  ctx.openView(ctx.model.uid + '-1', {
    mode: 'dialog',
    size: 'large',
    defineProperties: {}, // 새 팝업에서 사용할 컨텍스트 변수 등록
  });
});