Hide all lines (X axis and Y axis)

4 posts, 0 answers
  1. Bill
    Bill avatar
    94 posts
    Member since:
    Aug 2006

    Posted 20 Mar 2014 Link to this post

    I can hide major and minor grid lines, but does anyone know how to hide the X or Y axis line?
    See attach image.
    Thanks,
    ~bg
  2. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1492 posts

    Posted 24 Mar 2014 Link to this post

    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.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Jon
    Jon avatar
    6 posts
    Member since:
    Oct 2011

    Posted 23 Oct 2014 Link to this post

    I'm trying to do the same thing but on Mobile with App Builder - any thoughts?

    Luke
  5. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 27 Oct 2014 Link to this post

    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: {
             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.

     
Back to Top