Multiple chart lines with multiple axis/scales

[olivercortinas]

I am trying to make a multi line chart with different scales on X axis, something like this:
https://images.ctfassets.net/fevtq3bap7tj/2ihSQ6YJxi4IuyUOA4IckA/160e134bebbfcbebf0f7b8117e9c6594/Screen_Shot_2018-10-12_at_10.19.25_AM.png
But i have 2 problems:

1. The labels instead of appear between the axis are show after all the axis, this way some text is cut by the screen and i try to move closer to the axis but didn't work.
2. Obviously i have lines with different scales but for some reason i can make it work only when i adjust the points of the other series to the scales of the first series this is a bug or i am doing something wrong?

This is my actual code:

       private PlotModel RangeHiLowChart(string title)
       {
            var model = new PlotModel
            {
                PlotType = PlotType.XY,
                Title = title,
                LegendPlacement = LegendPlacement.Outside,
                LegendPosition = LegendPosition.BottomCenter,
                LegendOrientation = LegendOrientation.Horizontal,
                LegendBorderThickness = 0
            };
            var startDate = new DateTime(2018, 10, 15);
            var endDate = new DateTime(2019, 1, 31);

            var minValue = DateTimeAxis.ToDouble(startDate);
            var maxValue = DateTimeAxis.ToDouble(endDate);
            model.Axes.Add(new DateTimeAxis
            {
                Position = AxisPosition.Bottom,
                Minimum = minValue,
                Maximum = maxValue,
                StringFormat = "yyyy/MM/dd",
                IntervalType = DateTimeIntervalType.Days,
                MinorIntervalType = DateTimeIntervalType.Days,
                IntervalLength = 20,
                FontSize = 8,
                Angle = 45,
                IsZoomEnabled = true
            });
            
            model.Axes.Add(new LinearAxis
            {
                Position = AxisPosition.Left,
                //MinimumPadding = 0.05,
                //MaximumPadding = 0.05,
                TitleColor = OxyColors.Green,
                TextColor = OxyColors.Green,
                FontSize = 6,
                MajorStep = 1,
                MinorStep = 0.5,
                AxislineStyle = LineStyle.Dot,
                AxislineColor = OxyColors.Green,
                Minimum = 0,
                Maximum = 9,
                Title = "Moisture average",
            });

            var Points = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 2.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 30)), 3.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 11, 1)), 6.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 11, 15)), 5.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 12, 1)), 4.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 12, 15)), 1.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 1)), 2.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 15)), 1.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 8.75)
            };

            ThreeColorLineSeries lineSerie1 = new ThreeColorLineSeries
            {
                MarkerType = MarkerType.Triangle,
                ColorHi = OxyColors.SpringGreen,
                ColorLo = OxyColors.GreenYellow,
                Color = OxyColors.Green,
                MarkerSize = 3,
                MarkerStrokeThickness = 3,
                StrokeThickness = 3,
                Smooth = true,
                LimitHi = 5.55,
                LimitLo = 2.56,
                LineStyleHi = LineStyle.Dash,
                LineStyleLo = LineStyle.Dash,
                ItemsSource = Points
            };

            var PointsLow = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 2.56),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 2.56)
            };
            var low1 = new LineSeries()
            {
                ItemsSource = PointsLow,
                LineStyle = LineStyle.Dash,
                Color = OxyColors.Green
            };
            var PointsHi = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 5.55),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 5.55)
            };
            var hi1 = new LineSeries()
            {
                ItemsSource = PointsHi,
                LineStyle = LineStyle.Dash,
                Color = OxyColors.Green
            };
            model.Series.Add(low1);
            model.Series.Add(hi1);

            model.Axes.Add(new LinearAxis
            {
                Position = AxisPosition.Left,
                AxisDistance = 15,
                TitleColor = OxyColors.Red,
                TextColor = OxyColors.Red,
                FontSize = 6,
                MajorStep = 50,
                MinorStep = 25,
                AxislineStyle = LineStyle.Dot,
                AxislineColor = OxyColors.Red,
                Minimum = 100,
                Maximum = 800,
                Title = "ph Measure",
                AxisTitleDistance = 1
            });
            var Points2 = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 5.23),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 30)), 1.56),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 11, 1)), 2.50),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 11, 15)), 3.10),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 12, 1)), 2.30),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 12, 15)), 7.00),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 1)), 6.00),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 15)), 5.00),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 3.00)
            };
            ThreeColorLineSeries lineSerie2 = new ThreeColorLineSeries
            {
                MarkerType = MarkerType.Triangle,
                ColorHi = OxyColors.OrangeRed,
                ColorLo = OxyColors.PaleVioletRed,
                Color = OxyColors.Red,
                MarkerSize = 3,
                MarkerStrokeThickness = 3,
                StrokeThickness = 3,
                Smooth = true,
                LimitHi = 4.00,
                LimitLo = 2.00,
                LineStyleHi = LineStyle.Dash,
                LineStyleLo = LineStyle.Dash,
                ItemsSource = Points2
            };

            var PointsLow2 = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 2.00),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 2.00)
            };
            var low2 = new LineSeries()
            {
                ItemsSource = PointsLow2,
                LineStyle = LineStyle.Dash,
                Color = OxyColors.Red
            };
            var PointsHi2 = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 4.00),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 4.00)
            };
            var hi2 = new LineSeries()
            {
                ItemsSource = PointsHi2,
                LineStyle = LineStyle.Dash,
                Color = OxyColors.Red
            };
            model.Series.Add(low2);
            model.Series.Add(hi2);
            model.Series.Add(lineSerie1);
            model.Series.Add(lineSerie2);

            return model;
        }

This code make this graph that is pretty close of what i want.

But the idea is to have this code with each series the original value and make the same chart:

        private PlotModel RangeHiLowChart(string title)
        {
            var model = new PlotModel
            {
                PlotType = PlotType.XY,
                Title = title,
                LegendPlacement = LegendPlacement.Outside,
                LegendPosition = LegendPosition.BottomCenter,
                LegendOrientation = LegendOrientation.Horizontal,
                LegendBorderThickness = 0
            };
            var startDate = new DateTime(2018, 10, 15);
            var endDate = new DateTime(2019, 1, 31);

            var minValue = DateTimeAxis.ToDouble(startDate);
            var maxValue = DateTimeAxis.ToDouble(endDate);
            model.Axes.Add(new DateTimeAxis
            {
                Position = AxisPosition.Bottom,
                Minimum = minValue,
                Maximum = maxValue,
                StringFormat = "yyyy/MM/dd",
                IntervalType = DateTimeIntervalType.Days,
                MinorIntervalType = DateTimeIntervalType.Days,
                IntervalLength = 20,
                FontSize = 8,
                Angle = 45,
                IsZoomEnabled = true
            });
            
            model.Axes.Add(new LinearAxis
            {
                Position = AxisPosition.Left,
                //MinimumPadding = 0.05,
                //MaximumPadding = 0.05,
                TitleColor = OxyColors.Green,
                TextColor = OxyColors.Green,
                FontSize = 6,
                MajorStep = 1,
                MinorStep = 0.5,
                AxislineStyle = LineStyle.Dot,
                AxislineColor = OxyColors.Green,
                Minimum = 0,
                Maximum = 9,
                Title = "Moisture average",
            });

            var Points = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 2.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 30)), 3.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 11, 1)), 6.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 11, 15)), 5.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 12, 1)), 4.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 12, 15)), 1.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 1)), 2.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 15)), 1.75),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 8.75)
            };

            ThreeColorLineSeries lineSerie1 = new ThreeColorLineSeries
            {
                MarkerType = MarkerType.Triangle,
                ColorHi = OxyColors.SpringGreen,
                ColorLo = OxyColors.GreenYellow,
                Color = OxyColors.Green,
                MarkerSize = 3,
                MarkerStrokeThickness = 3,
                StrokeThickness = 3,
                Smooth = true,
                LimitHi = 5.55,
                LimitLo = 2.56,
                LineStyleHi = LineStyle.Dash,
                LineStyleLo = LineStyle.Dash,
                ItemsSource = Points
            };

            var PointsLow = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 2.56),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 2.56)
            };
            var low1 = new LineSeries()
            {
                ItemsSource = PointsLow,
                LineStyle = LineStyle.Dash,
                Color = OxyColors.Green
            };
            var PointsHi = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 5.55),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 5.55)
            };
            var hi1 = new LineSeries()
            {
                ItemsSource = PointsHi,
                LineStyle = LineStyle.Dash,
                Color = OxyColors.Green
            };
            model.Series.Add(low1);
            model.Series.Add(hi1);

            model.Axes.Add(new LinearAxis
            {
                Position = AxisPosition.Left,
                AxisDistance = 15,
                TitleColor = OxyColors.Red,
                TextColor = OxyColors.Red,
                FontSize = 6,
                MajorStep = 50,
                MinorStep = 25,
                AxislineStyle = LineStyle.Dot,
                AxislineColor = OxyColors.Red,
                Minimum = 100,
                Maximum = 800,
                Title = "ph Measure",
                AxisTitleDistance = 1
            });
            var Points2 = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 523),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 30)), 156),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 11, 1)), 250),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 11, 15)), 310),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 12, 1)), 230),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 12, 15)), 700),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 1)), 600),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 15)), 500),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 300)
            };
            ThreeColorLineSeries lineSerie2 = new ThreeColorLineSeries
            {
                MarkerType = MarkerType.Triangle,
                ColorHi = OxyColors.OrangeRed,
                ColorLo = OxyColors.PaleVioletRed,
                Color = OxyColors.Red,
                MarkerSize = 3,
                MarkerStrokeThickness = 3,
                StrokeThickness = 3,
                Smooth = true,
                LimitHi = 400,
                LimitLo = 200,
                LineStyleHi = LineStyle.Dash,
                LineStyleLo = LineStyle.Dash,
                ItemsSource = Points2
            };

            var PointsLow2 = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 200),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 200)
            };
            var low2 = new LineSeries()
            {
                ItemsSource = PointsLow2,
                LineStyle = LineStyle.Dash,
                Color = OxyColors.Red
            };
            var PointsHi2 = new List<DataPoint>
            {
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2018, 10, 15)), 400),
                new DataPoint(DateTimeAxis.ToDouble(new DateTime(2019, 1, 31)), 400)
            };
            var hi2 = new LineSeries()
            {
                ItemsSource = PointsHi2,
                LineStyle = LineStyle.Dash,
                Color = OxyColors.Red
            };
            model.Series.Add(low2);
            model.Series.Add(hi2);
            model.Series.Add(lineSerie1);
            model.Series.Add(lineSerie2);

            return model;
        }

[objorke]

This is general issue, so I removed Xamarin Forms.
I struggle to understand the second issue, can the text be improved?
Can the title be improved? Is it a bug related to the labels?
Don't put multiple bugs/feature requests in the same issue, it makes it more difficult to close.
I added ```cs to the code blocks.

[olivercortinas]

Yes sorry you can say that this are 2 bugs:

1. How we can improve the distance of the labels of each axis so the labels can be seen and not disappear as the second label, if you see the red label axis is almost gone.
2. This si something mor of scales and axis, if you see the datapoints for the var Points2 has values between 100 and 900, if i set those values the red line didn't appear on the chart. i have to set values between 1 and 9 and that is the chart i add, did you understand? I think this is an issue with the axis key but i set it also and didn't work either.