Question

我正在使用c3js的堆积面积图。单击图例项目时，它会切换图表中该项目的区域。

我想在c3图表之外的其他html元素中启动此切换功能。所以我想触发图例项的click事件。

现在我知道您已经可以订阅图例项目的点击事件

public class TextBlockMoo : TextBlock 
{
    public String SelectedText = "";

    public delegate void TextSelectedHandler(string SelectedText);
    public event TextSelectedHandler OnTextSelected;
    protected void RaiseEvent()
    {
        if (OnTextSelected != null){OnTextSelected(SelectedText);}
    }

    TextPointer StartSelectPosition;
    TextPointer EndSelectPosition;
    Brush _saveForeGroundBrush;
    Brush _saveBackGroundBrush;

    TextRange _ntr = null;

    protected override void OnMouseDown(MouseButtonEventArgs e)
    {
        base.OnMouseDown(e);

        if (_ntr!=null) {
            _ntr.ApplyPropertyValue(TextElement.ForegroundProperty, _saveForeGroundBrush);
            _ntr.ApplyPropertyValue(TextElement.BackgroundProperty, _saveBackGroundBrush);
        }

        Point mouseDownPoint = e.GetPosition(this);
        StartSelectPosition = this.GetPositionFromPoint(mouseDownPoint, true);            
    }

    protected override void OnMouseUp(MouseButtonEventArgs e)
    {
        base.OnMouseUp(e);
        Point mouseUpPoint = e.GetPosition(this);
        EndSelectPosition = this.GetPositionFromPoint(mouseUpPoint, true);

        _ntr = new TextRange(StartSelectPosition, EndSelectPosition);

        // keep saved
        _saveForeGroundBrush = (Brush)_ntr.GetPropertyValue(TextElement.ForegroundProperty);
        _saveBackGroundBrush = (Brush)_ntr.GetPropertyValue(TextElement.BackgroundProperty);
        // change style
        _ntr.ApplyPropertyValue(TextElement.BackgroundProperty, new SolidColorBrush(Colors.Yellow));
        _ntr.ApplyPropertyValue(TextElement.ForegroundProperty, new SolidColorBrush(Colors.DarkBlue));

        SelectedText = _ntr.Text;
    }
}

但我想解雇这个事件，而不是在事件发生的时候听。

我注意到图例项是一个svg c3.generate({ ... legend: { item: { onclick: function(id) { ... } } } })节点，如下所示：

<g>

所以我尝试使用jquery来点击它

<g class="c3-legend-item c3-legend-item-MyItem"...>

但这似乎不起作用。

有什么想法吗？

修改我找到了解决方案 How to invoke "click" event programmatically in d3?

事实证明你不能像我一样使用JQuery在d3上触发click事件。我使用了创建jQuery.d3Click（）函数的答案。使用d3选择元素并单击的另一个解决方案对我来说不起作用，因为有其他事件监听器并直接调用onclick函数会破坏c3代码中的一些假设。

在c3js中，如何在图例项目上触发click事件？

0 个答案: