I would like to visually distinguish a certain element in a series from the others if its value matches a given criteria (for example, value exceeds a threshold). Ideally, I'd want to add a hash to my bars, because I want to keep all items with the same color (I don't want to use the ColorField).

Something similar is available in Kendo: https://demos.telerik.com/kendo-ui/bar-charts/visuals.

It would be nice to make the label container less than the width of the element so that it stands out more.

I know that it can be set to different colors and transparent but adjusting the width would be a nice addition as well.

I have a page where I am displaying a chart and associated data in a grid below.

Being able to range select in the chart like in the asp.net core link below would offer a much better user experience.
That way the selected range could be specifically targeted in the grid data below the chart.

https://demos.telerik.com/aspnet-core/chart-api/selection

Like in Kendo (here and here) so I can change the cursor for the chart to a pointer when the user hovers the series - I want that to indicate they can click on it (through the SeriesClick event).

---

ADMIN EDIT

workaround that you can consider which uses CSS to traverse the chart rendering:

<style>
    /* this will work in the chart below with its settings, axes, title and so on */
    .k-chart g[clip-path] g g g path {
        cursor: pointer;
    }

    /* a very generic selector that will capture just about everything in the plot area of the chart */
    /* Try this if you cannot make a more specific selector like the one above by inspecting the rendered content */
    /*.k-chart path {
        cursor: pointer;
    }*/
</style>

<TelerikChart>
    <ChartSeriesItems>
        <ChartSeries Type="ChartSeriesType.Column" Name="Product 1" Data="@series1Data">
        </ChartSeries>
        <ChartSeries Type="ChartSeriesType.Column" Name="Product 2" Data="@series2Data">
        </ChartSeries>
    </ChartSeriesItems>

    <ChartCategoryAxes>
        <ChartCategoryAxis Categories="@xAxisItems">
        </ChartCategoryAxis>
    </ChartCategoryAxes>

    <ChartTitle Text="Quarterly revenue per product"></ChartTitle>

    <ChartLegend Position="ChartLegendPosition.Right">
    </ChartLegend>
</TelerikChart>

@code {
    public List<object> series1Data = new List<object>() { 10, 2, 5, 6 };
    public List<object> series2Data = new List<object>() { 5, 8, 2, 7 };
    public string[] xAxisItems = new string[] { "Q1", "Q2", "Q3", "Q4" };
}

---

When I place a Chart in a small container, for example, a div, the labels are cut off and thus unreadable.

===

ADMIN EDIT

===

A possible workaround for the time being is changing the position of the labels so they are not cut off. For example: https://blazorrepl.telerik.com/mHkNkCEC16hMJnTg26.

Hello,

Please allow us to distinguish which mouse button triggered the SeriesClick event.

---

ADMIN EDIT

Screen recording attached below, code to reproduce  it too.

---