Determine column series color

[Johnathan]

Hello,

I'm working on mapping column data to RadHTMLChart control & I'm running into a label display issue. One of the column colors that is used by my graph is black & it makes the tooltip label difficult to read since it also defaults to black. Is there a way to determine what color the column will be when the color for the column is set dynamically so that I can update the black column's tooltip label color? 

Thanks,

Johnathan Beam

[Danail Vasilev]

Hi Johnathan,

You can try to handle the seriesHover event where you can get the tooltip element by class name. After that you can get the color of the element and change it if needed.

Regards,
Danail Vasilev
Telerik

[Johnathan]

Hi Danail,

Thank you for your response. Is there a code example for doing this?

Thanks,

Johnathan

[Danail Vasilev]

Hello Johnathan,

You can try the code below:

<script>
    function seriesHover(e) {
        setTimeout(function () {
            $telerik.$('.k-tooltip')[0].style.color = "red";
            $telerik.$('.k-tooltip')[0].style.backgroundColor = "blue";
        }, 10);
    }
</script>
<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="600" Height="400">
    <ClientEvents OnSeriesHover="seriesHover" />
    <PlotArea>
        <Series>
            <telerik:ColumnSeries Name="Series 1">
                <SeriesItems>
                    <telerik:CategorySeriesItem Y="30" />
                    <telerik:CategorySeriesItem Y="10" />
                    <telerik:CategorySeriesItem Y="20" />
                </SeriesItems>
            </telerik:ColumnSeries>
        </Series>
        <XAxis>
            <LabelsAppearance RotationAngle="33"></LabelsAppearance>
            <Items>
                <telerik:AxisItem LabelText="Item 1" />
                <telerik:AxisItem LabelText="Item 2" />
                <telerik:AxisItem LabelText="Item 3" />
            </Items>
        </XAxis>
    </PlotArea>
</telerik:RadHtmlChart>

Regards,
Danail Vasilev
Telerik