This is a migrated thread and some comments may be shown as answers.

Hide all lines (X axis and Y axis)

3 Answers 821 Views

Chart (HTML5)

This is a migrated thread and some comments may be shown as answers.

3 Answers, 1 is accepted

answered on 24 Mar 2014, 01:32 PM

Hello Bill,

You can use the Visible property of the axes, in order to hide them. For example:

ASPX:

<telerik:RadHtmlChart runat="server" ID="ColumnChart1" Transitions="true">

<PlotArea>

<Series>

<telerik:ColumnSeries Name="Product 1">

<TooltipsAppearance BackgroundColor="Orange" DataFormatString="{0} sales" />

<SeriesItems>

<telerik:CategorySeriesItem Y="15000" />

<telerik:CategorySeriesItem Y="23000" />

<telerik:CategorySeriesItem Y="10000" />

<telerik:CategorySeriesItem Y="16000" />

</SeriesItems>

</telerik:ColumnSeries>

</Series>

<XAxis AxisCrossingValue="0" Color="Black" MajorTickType="Outside" MinorTickType="Outside" Visible="false"

Reversed="false">

<Items>

<telerik:AxisItem LabelText="1" />

<telerik:AxisItem LabelText="2" />

<telerik:AxisItem LabelText="3" />

<telerik:AxisItem LabelText="4" />

</Items>

<LabelsAppearance DataFormatString="Q{0}" RotationAngle="0" />

<MajorGridLines Color="#EFEFEF" Width="1" />

<MinorGridLines Color="#F7F7F7" Width="1" />

<TitleAppearance Position="Center" RotationAngle="0" Text="Quarters" />

</XAxis>

<YAxis AxisCrossingValue="0" Color="Black" MajorTickSize="1" MajorTickType="Outside" Visible="false"

MaxValue="50000" MinorTickSize="1" MinorTickType="Outside" MinValue="0" Reversed="false"

Step="10000">

<LabelsAppearance DataFormatString="{0} sales" RotationAngle="0" />

<TitleAppearance Position="Center" RotationAngle="0" Text="Sales" />

</YAxis>

</PlotArea>

</telerik:RadHtmlChart>

Regards,
Danail Vasilev
Telerik

Build cross-platform mobile apps using Visual Studio and .NET. Register for the online webinar on 03/27/2014, 11:00AM US ET.. Seats are limited.

answered on 27 Oct 2014, 05:47 PM

Hi Jon,

I suppose in AppBuilder you are using the Kendo UI DataViz Chart widget. If this is the case, then you can control the X and Y axis lines through the following set of properties:

valueAxis
- line
- majorGridLines
categoryAxis
- line
- majorGridLines

valueAxis: {

line: {

visible: false

},

majorGridLines:{

visible:false

}

},

categoryAxis: {

line: {

visible: false

},

majorGridLines:{

visible:false

}

},

If you have further questions, please post them in the Kendo UI forums or submit a support ticket for the Kendo UI DataViz widgets as this way your questions will reach the Kendo UI support specialists who will be able to assist you further with your development.

Regards,
Tina Stancheva
Telerik

Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting

Testing & Mocking

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Hide all lines (X axis and Y axis)

3 Answers, 1 is accepted