Problem formatting Htmlchart

5 posts, 0 answers
  1. Lee
    Lee avatar
    5 posts
    Member since:
    Jul 2011

    Posted 08 Jan 2015 Link to this post

    Hi, I am having a problem formatting a HtmlChart. Specifically I want to reduce spacing/padding or margins in the the axis.I also want to hide the borders (lines) of the x and y axis but cant seem to find a way to do this. Below is aspx. I have also attached image of how it looks now (current). And how I want it to look (desired). I want the horizontal bars to have almost no gap (eg 5 px or so) so that its more compact. How can I accomplish this do I have to hack w css? If so what are the relevant properties? Thanks

    <telerik:RadHtmlChart runat="server" ID="rcRatings" Height="150px"
    Width="200px">
    <PlotArea>
    <Series>
    <telerik:BarSeries DataField="rating" Name="Rating">
    <Appearance >
    <FillStyle BackgroundColor="Orange" />
    </Appearance>
    <LabelsAppearance Visible="false">
    </LabelsAppearance>
    </telerik:BarSeries>
    </Series>
    <XAxis DataLabelsField="title">
    <MinorGridLines Visible="false"></MinorGridLines>
    <MajorGridLines Visible="false"></MajorGridLines>
    </XAxis>
    <YAxis Step="1">
    <MinorGridLines Visible="false"></MinorGridLines>
    <MajorGridLines Visible="false"></MajorGridLines>
    <LabelsAppearance Visible = "false" />
    <TitleAppearance Visible = "false" />
    </YAxis>
    </PlotArea>
    <Legend>
    <Appearance Visible="false"></Appearance>
    </Legend>
    <ChartTitle>
    <Appearance Visible="False" />
    </ChartTitle>
    </telerik:RadHtmlChart>
  2. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1490 posts

    Posted 09 Jan 2015 Link to this post

    Hello Lee,

    Please refer to the Gap and Spacing help article for details on how to control the distance between the items.

    As for hiding only the axes without the labels you can set a width of 0. For example:
    <XAxis Width="0">
        <Items>
            <telerik:AxisItem LabelText="1" />
            <telerik:AxisItem LabelText="2" />
            <telerik:AxisItem LabelText="3" />
        </Items>
    </XAxis>

    Regards,
    Danail Vasilev
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Lee
    Lee avatar
    5 posts
    Member since:
    Jul 2011

    Posted 09 Jan 2015 in reply to Danail Vasilev Link to this post

    Danail, my BarSeries or ChartSeries dot not have any properties for Gap or Spacing. eg.

    Type 'Telerik.Web.UI.BarSeries' does not have a public property named 'Gap'.
    Type 'Telerik.Web.UI.BarSeries' does not have a public property named 'Spacing'.

    I am using version 2012.2.912.35

    Unfortunately I don't have any control over the environment in terms of the dll versions etc. Is there anything I can do similar in my version?

    Thanks
    Lee
  5. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1490 posts

    Posted 12 Jan 2015 Link to this post

    Hello Lee,

    Yes, you can set the properties through the kendoObject, as illustrated in this feedback item.

    Regards,
    Danail Vasilev
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  6. Lee
    Lee avatar
    5 posts
    Member since:
    Jul 2011

    Posted 12 Jan 2015 in reply to Danail Vasilev Link to this post

    Danail, that seems to have done the trick and I can certainly make this work.

    Thank you!

    Lee
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017