Chart.js &Angular 2 - ng2-charts 自定义点击事件 [英] Chart.js & Angular 2 - ng2-charts Custom on Click Event

问题描述

我正在尝试在我的 Angular 2 项目中实现 ng2-charts，我想知道如何创建自定义 onclick 事件.意思是，我想覆盖购物车上当前的 onclick 事件以执行一些自定义功能(重定向到页面、显示模式等).

有没有简单的方法可以做到这一点?它是内置的吗?

如有任何见解将不胜感激

解决方案

尝试阅读 DOCS

他们对使用的解释非常好且易于理解.

内置 2 个事件处理程序:

活动

chartClick:点击图表时触发，返回有关活动点和标签的信息

chartHover:在图表上发生鼠标移动(悬停)时触发，返回有关活动点和标签的信息

<小时>

在代码中它看起来像这样:

chartHovered 和 chartClicked 是您的自定义函数，它们可以有其他名称，并执行自定义操作，例如显示模态、重定向到 url 等.

I am trying to implement ng2-charts in my Angular 2 project and I was wondering about creating custom onclick events. Meaning, I want to override the current onclick events on the carts to do some custom functions (redirect to a page, have a modal show up, etc).

Is there a simple way to do this? Is it built in at all?

Any insight would be appreciated it

解决方案

Try to read DOCS

They have pretty good and understandable explanation of use.

There-are built-in 2 event handlers:

Events

chartClick: fires when click on a chart has occurred, returns information regarding active points and labels

chartHover: fires when mousemove (hover) on a chart has occurred, returns information regarding active points and labels

---

In code it looks like that:

 <base-chart class="chart"
            [datasets]="lineChartData"
            [labels]="lineChartLabels"
            [options]="lineChartOptions"
            [colors]="lineChartColours"
            [legend]="lineChartLegend"
            [chartType]="lineChartType"
            (chartHover)="chartHovered($event)"
            (chartClick)="chartClicked($event)"></base-chart>
  </div>

that chartHovered and chartClicked are your custom functions, which could has another names, and do custom things like showing modal, redirect to url etc.

这篇关于Chart.js &amp;Angular 2 - ng2-charts 自定义点击事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！