[CLOSED] How to change background color of labels in chart

[livehealthierGF]

Is it possible to change background color for all labels of axis in the chart?

[Baidaly]

Hello!

If you want to change background color of each axis label it's not possible because label is inline element. But maybe I misunderstood you.

[livehealthierGF]

Hello!

If you want to change background color of each axis label it's not possible because label is inline element. But maybe I misunderstood you.

Hello, It is possible using sprites. You can do rectangles behind the label. It doesn't work if your chat resizable. You can close the topic

[livehealthierGF]

Let me know if I can do something like done on the image attached without sprites?

  <ext:Chart ID="crtProgress" runat="server" Shadow="false" Animate="true"
                                            Store="strGoals" Height="225" Cls="lhapp-chart">
                                            <Items>
                                               <ext:Sprite Type="Rect" X="8" Y="0" Width="15" Height="210" Fill="#808080"></ext:Sprite>
                                               <ext:Sprite Type="Rect" X="8" Y="200" Width="320" Height="15" Fill="#808080"></ext:Sprite>
                                               <ext:Sprite Text="week" Type="Text" X="250" Y="210" Fill="#fff" Font="11px Arial"></ext:Sprite>
                                               <ext:Sprite Text="steps" Type="Text" X="-25" Y="-2" Fill="#fff" Font="11px Arial">
                                                   <Rotate Degrees="270"></Rotate>
                                               </ext:Sprite>
                                            </Items>
                                            <Axes>
                                                <ext:NumericAxis Position="Left" Grid="false" Minimum="0" Maximum="1" DashSize="0">
                                                    <Label Padding="0" Fill="#fff" Font="11px Arial" Width="10">
                                                        <Rotate Degrees="270"></Rotate>
                                                        <Renderer Handler="return verticalAxisRenderer(value);" />
                                                    </Label>
                                                </ext:NumericAxis>
                                                <ext:CategoryAxis Fields="shortName" Position="Bottom" DashSize="1" >
                                                    <Label Padding="0" Fill="#fff" Font="11px Arial">
                                                    </Label>
                                                </ext:CategoryAxis>
                                            </Axes>
                                            <Series>
                                                <ext:ColumnSeries Axis="Bottom" XField="name" YField="value">
                                                    <Renderer Fn="columnRenderer"></Renderer>
                                                </ext:ColumnSeries>
                                            </Series>
                                        </ext:Chart>

[Baidaly]

I think it's reasonable solution in this case because Charts have many limitations like this one.

But I'll ask my colleagues maybe they can offer something else.

[Daniil]

Hi,

I can confirm that there is no a built-in possibility to fill background as you need. So, your solution with Sprites looks the only solution to achieve it.