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

ScatterLine enable to move second y axis

3 Answers 95 Views
Chart (HTML5)
This is a migrated thread and some comments may be shown as answers.
w l
Top achievements
Rank 1
w l asked on 01 Mar 2017, 11:56 AM
<form id="form1" runat="server">
        <div>
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
        </div>
        <telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="100%" Height="500px" Skin="Metro">
            <Legend>
                <Appearance Position="Bottom">
                </Appearance>
            </Legend>
            <PlotArea>
                <AdditionalYAxes>
                    <telerik:AxisY MaxValue="100" MinValue="0" Name="HS" Step="10"   Color="#00CC00" >
                        <LabelsAppearance DataFormatString="{0}%"></LabelsAppearance>
                         <MinorGridLines Visible="false"></MinorGridLines>
                    <MajorGridLines Visible="true"></MajorGridLines>
                    </telerik:AxisY>
 
                </AdditionalYAxes>
                <Series>
                    <telerik:ScatterLineSeries DataFieldX="RQ" DataFieldY="RCYL1" Name="RCYL1">
                        <LabelsAppearance Visible="false"></LabelsAppearance>                       
                        <Appearance>
                            <FillStyle BackgroundColor="Fuchsia" />
                        </Appearance>
                    </telerik:ScatterLineSeries>
                    <telerik:ScatterLineSeries DataFieldX="RQ" DataFieldY="RCYL2" Name="RCYL2" >
                    <LabelsAppearance Visible="false"></LabelsAppearance>                      
                         <Appearance>
                            <FillStyle BackgroundColor="Red" />
                        </Appearance>
                    </telerik:ScatterLineSeries>
                    <telerik:ScatterLineSeries AxisName="HS" DataFieldX="RQ" DataFieldY="HS" Name="HS">
                    <LabelsAppearance Visible="false"></LabelsAppearance>
                         <Appearance>
                            <FillStyle BackgroundColor="#00CC00" />
                        </Appearance>
                    </telerik:ScatterLineSeries>
                </Series>
                <XAxis BaseUnit="Days" Type="Date" MajorTickType="None" >
                    <LabelsAppearance DataFormatString="yyyy-MM-dd">
                    </LabelsAppearance>
                    <MinorGridLines Visible="false"></MinorGridLines>
                    <MajorGridLines Visible="true"></MajorGridLines>
                    <AxisCrossingPoints>
                        <telerik:AxisCrossingPoint Value="0" />
                        <telerik:AxisCrossingPoint Value="10" />
                    </AxisCrossingPoints>
                </XAxis>
                <YAxis MajorTickType="None">
                     <MinorGridLines Visible="false"></MinorGridLines>
                    <MajorGridLines Visible="true"></MajorGridLines>
                    <MinorGridLines Visible="false"></MinorGridLines>
                </YAxis>
            </PlotArea>           
        </telerik:RadHtmlChart>           
    </form>

Telerik.Web.UI (2016.3.914.40)

3 Answers, 1 is accepted

Sort by
0
Marin Bratanov
Telerik team
answered on 06 Mar 2017, 10:34 AM

Hi,

As you have already found, you need to set the AxisCrossingValue of the x-axis to an array of values that will correspond to the y-axes indexes. You should use values that are large enough considering your data, for example: 

<AxisCrossingPoints>
    <telerik:AxisCrossingPoint Value="0" />
    <telerik:AxisCrossingPoint Value="987654321" />
</AxisCrossingPoints>


Regards,

Marin Bratanov
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
w l
Top achievements
Rank 1
answered on 08 Mar 2017, 10:32 AM
I use the way you provide, without any change
0
w l
Top achievements
Rank 1
answered on 08 Mar 2017, 11:00 AM
{
  "Table": [
    {
      "JH": "temp",
      "RQ": "2017-03-05",
      "RCYL1": 2.10,
      "RCYL2": 1.20,
      "HS": 44.60
    },
    {
      "JH": "temp",
      "RQ": "2017-03-04",
      "RCYL1": 2.20,
      "RCYL2": 1.20,
      "HS": 44.60
    },
    {
      "JH": "temp",
      "RQ": "2017-03-03",
      "RCYL1": 3.0,
      "RCYL2": 1.70,
      "HS": 44.60
    },
    {
      "JH": "temp",
      "RQ": "2017-03-02",
      "RCYL1": 4.80,
      "RCYL2": 4.0,
      "HS": 15.70
    },
    {
      "JH": "temp",
      "RQ": "2017-03-01",
      "RCYL1": 2.80,
      "RCYL2": 2.40,
      "HS": 15.70
    },
    {
      "JH": "temp",
      "RQ": "2017-02-28",
      "RCYL1": 4.50,
      "RCYL2": 0.20,
      "HS": 95.0
    },
    {
      "JH": "temp",
      "RQ": "2017-02-27",
      "RCYL1": 2.10,
      "RCYL2": 0.10,
      "HS": 95.0
    },
    {
      "JH": "temp",
      "RQ": "2017-02-26",
      "RCYL1": 1.90,
      "RCYL2": 0.10,
      "HS": 95.0
    },
    {
      "JH": "temp",
      "RQ": "2017-02-25",
      "RCYL1": 2.90,
      "RCYL2": 1.80,
      "HS": 39.10
    },
    {
      "JH": "temp",
      "RQ": "2017-02-24",
      "RCYL1": 2.90,
      "RCYL2": 1.80,
      "HS": 39.10
    },
    {
      "JH": "temp",
      "RQ": "2017-02-23",
      "RCYL1": 2.90,
      "RCYL2": 1.80,
      "HS": 39.10
    },
    {
      "JH": "temp",
      "RQ": "2017-02-22",
      "RCYL1": 3.10,
      "RCYL2": 1.90,
      "HS": 39.10
    },
    {
      "JH": "temp",
      "RQ": "2017-02-21",
      "RCYL1": 2.40,
      "RCYL2": 1.50,
      "HS": 36.70
    },
    {
      "JH": "temp",
      "RQ": "2017-02-20",
      "RCYL1": 2.10,
      "RCYL2": 0.40,
      "HS": 80.80
    },
    {
      "JH": "temp",
      "RQ": "2017-02-19",
      "RCYL1": 2.90,
      "RCYL2": 0.60,
      "HS": 80.80
    },
    {
      "JH": "temp",
      "RQ": "2017-02-18",
      "RCYL1": 3.10,
      "RCYL2": 0.60,
      "HS": 80.80
    },
    {
      "JH": "temp",
      "RQ": "2017-02-17",
      "RCYL1": 2.40,
      "RCYL2": 0.50,
      "HS": 80.80
    },
    {
      "JH": "temp",
      "RQ": "2017-02-16",
      "RCYL1": 3.30,
      "RCYL2": 0.60,
      "HS": 80.80
    },
    {
      "JH": "temp",
      "RQ": "2017-02-15",
      "RCYL1": 3.30,
      "RCYL2": 2.50,
      "HS": 25.60
    },
    {
      "JH": "temp",
      "RQ": "2017-02-14",
      "RCYL1": 2.50,
      "RCYL2": 0.10,
      "HS": 95.0
    },
    {
      "JH": "temp",
      "RQ": "2017-02-13",
      "RCYL1": 2.80,
      "RCYL2": 2.10,
      "HS": 25.70
    },
    {
      "JH": "temp",
      "RQ": "2017-02-12",
      "RCYL1": 2.60,
      "RCYL2": 1.90,
      "HS": 25.70
    },
    {
      "JH": "temp",
      "RQ": "2017-02-11",
      "RCYL1": 2.30,
      "RCYL2": 1.70,
      "HS": 25.70
    },
    {
      "JH": "temp",
      "RQ": "2017-02-10",
      "RCYL1": 2.60,
      "RCYL2": 1.90,
      "HS": 25.70
    },
    {
      "JH": "temp",
      "RQ": "2017-02-09",
      "RCYL1": 2.60,
      "RCYL2": 1.40,
      "HS": 45.0
    },
    {
      "JH": "temp",
      "RQ": "2017-02-08",
      "RCYL1": 2.90,
      "RCYL2": 1.60,
      "HS": 45.0
    },
    {
      "JH": "temp",
      "RQ": "2017-02-07",
      "RCYL1": 1.60,
      "RCYL2": 0.60,
      "HS": 65.30
    },
    {
      "JH": "temp",
      "RQ": "2017-02-06",
      "RCYL1": 1.70,
      "RCYL2": 0.60,
      "HS": 63.10
    },
    {
      "JH": "temp",
      "RQ": "2017-02-05",
      "RCYL1": 1.70,
      "RCYL2": 1.40,
      "HS": 19.70
    }
  ]
}
Tags
Chart (HTML5)
Asked by
w l
Top achievements
Rank 1
Answers by
Marin Bratanov
Telerik team
w l
Top achievements
Rank 1
Share this question
or