Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 722
  • Last Modified:

asp.net chart control how to create to y axis

I have  a chart control that shows like this which is rents for a particular period.  See Image 1,  What I need to do is add another series, this on being occupancy and this follows the numbers that I would like to see on the right.  This range is from 75% to 100%, So on the right I would like to the pct's on the right the chart with another line in chart area following those pcts.

Sample html code would be great

thanks
existing chart

Open in new window

0
mgmhicks
Asked:
mgmhicks
1 Solution
 
Robert SchuttSoftware EngineerCommented:
Try something like this:
        <asp:XmlDataSource ID="XmlDataSource1" runat="server">
            <Data>
                <root>
                    <record id="1" name="Peter" amount="310000" perc="80" />
                    <record id="2" name="Paul" amount="318000" perc="95" />
                    <record id="3" name="Mary" amount="340000" perc="85" />
                </root>
            </Data>
        </asp:XmlDataSource>
        <asp:Chart ID="Chart1" runat="server" DataSourceID="XmlDataSource1" ImageStorageMode="UseImageLocation" Width="1100" Height="450">
            <Series>
                <asp:Series Name="Series1" ChartType="Line" LegendText="Net Rents" XValueMember="name" YValueMembers="amount">
                </asp:Series>
                <asp:Series Name="Series2" ChartType="Line" LegendText="Occupancy %" XValueMember="name" YValueMembers="perc" YAxisType="Secondary">
                </asp:Series>
            </Series>
            <ChartAreas>
                <asp:ChartArea Name="ChartArea1">
                    <AxisY Interval="10000" Minimum="300000" Maximum="350000">
                        <MajorGrid LineColor="Gray" />
                    </AxisY>
                    <AxisY2 Interval="5" Minimum="75" Maximum="100">
                        <MajorGrid LineColor="Silver" />
                        <LabelStyle ForeColor="Orange" />
                    </AxisY2>
                </asp:ChartArea>
            </ChartAreas>
            <Legends>
                <asp:Legend LegendStyle="Row" Docking="Top"></asp:Legend>
            </Legends>
        </asp:Chart>

Open in new window


So key parts are: YAxisType="Secondary" in the second Series and <AxisY2 Interval="5" Minimum="75" Maximum="100"> in the ChartArea.

Note that I 'manually' made sure both y axes have the same number of lines otherwise it can get ugly, but you can also play with color (as shown in the code) or disable one of them.

example pic
0
 
mgmhicksAuthor Commented:
Awesome example thank you!
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now