Skip to main content

ChartClickEventArgs

Namespace: Wisej.Web.Ext.ChartJS

Assembly: Wisej.Web.Ext.ChartJS (4.1.0.0)

Provides data for the ChartClick event of the ChartJS control.

public class ChartClickEventArgs : EventArgs

The arrays DataSets, DataPoints and Values have the same length and are parallel: the element at index i of each array describes the same chart element returned by Chart.js for the click position. SelectedDataSet and SelectedValue describe the single element directly underneath the click.

Example:

private void chartJS1_ChartClick(object sender, ChartClickEventArgs e)
{
    this.listBox1.Items.Clear();
    for (int i = 0; i < e.DataPoints.Length; i++)
    {
        var label = this.chartJS1.Labels[e.DataPoints[i]];
        this.listBox1.Items.Add($"{e.DataSets[i].Label} - {label}: {e.Values[i]}");
    }
}

Properties​

Instance member DataPoints​

Int32[]: Returns the indexes of the data points in the click radius.

Value: An array of zero-based indexes into the Data array of the corresponding data set. The same index also identifies the label in Labels.

Example:

private void chartJS1_ChartClick(object sender, ChartClickEventArgs e)
{
    int index = e.DataPoints[0];
    AlertBox.Show("You clicked " + this.chartJS1.Labels[index]);
}

Instance member DataSets​

DataSet[]: Returns the data sets in the click radius.

Value: An array with the DataSet of each clicked element. The same data set may appear more than once.

Example:

private void chartJS1_ChartClick(object sender, ChartClickEventArgs e)
{
    var names = e.DataSets.Select(d => d.Label).Distinct();
    this.labelInfo.Text = String.Join(", ", names);
}

Instance member SelectedDataSet​

DataSet: Returns the data set directly underneath the click.

Value: The DataSet that contains the element directly underneath the click, or null when there is no clicked element.

Example:

private void chartJS1_ChartClick(object sender, ChartClickEventArgs e)
{
    // toggle the visibility of the clicked data set.
    if (e.SelectedDataSet != null)
    {
        e.SelectedDataSet.Hidden = !e.SelectedDataSet.Hidden;
        this.chartJS1.Update();
    }
}

Instance member SelectedValue​

Object: Returns the value directly underneath the click.

Value: The value in the Data array of SelectedDataSet for the element directly underneath the click, or null when there is no clicked element.

Example:

private void chartJS1_ChartClick(object sender, ChartClickEventArgs e)
{
    this.textBoxValue.Text = Convert.ToString(e.SelectedValue);
}

Instance member Values​

Object[]: Returns the values of the data points in the click radius.

Value: An array with the value of each data point, taken from the Data array of the corresponding data set.

The value at index i belongs to the data set at index i in DataSets and to the data point at index i in DataPoints.

Example:

private void chartJS1_ChartClick(object sender, ChartClickEventArgs e)
{
    var total = e.Values.Sum(v => Convert.ToDouble(v));
    this.labelTotal.Text = "Total: " + total;
}

Used By​

NameDescription
ChartClickEventHandlerRepresents the method that will handle the ChartClick event in a ChartJS.