Data Visualization ▸ Scatter

@(Html.DevExtreme().Chart()
    .ID("chart")
    .CommonSeriesSettings(s => s.Type(SeriesType.Scatter))
    .Series(s => {
        s.Add().ArgumentField("X1").ValueField("Y1");
        s.Add().ArgumentField("X2").ValueField("Y2").Point(p => p
            .Symbol(PointSymbol.TriangleDown)
        );
    })
    .ArgumentAxis(a => a
        .Grid(g => g.Visible(true))
        .TickInterval(5)
        .MinorGrid(g => g.Visible(true))
    )
    .ValueAxis(a => a.Add().TickInterval(50))
    .Legend(l => l.Visible(false))
    .CommonPaneSettings(s => s.Border(b => b.Visible(true)))
    .DataSource(Model)
)

using DevExtreme.AspNet.Data;
using DevExtreme.AspNet.Mvc;
using DevExtreme.MVC.Demos.Models.SampleData;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text.Json;
using System.Web.Mvc;

namespace DevExtreme.MVC.Demos.Controllers {
    public class ChartsController : Controller {

        public ActionResult Scatter() {
            return View(SampleData.GetScatterData());
        }

    }
}

using System;
using System.Collections.Generic;
using DevExpress.Data.Utils;

namespace DevExtreme.MVC.Demos.Models.SampleData {
    public partial class SampleData {
        public static IEnumerable<object> GetScatterData() {
            var rnd = NonCryptographicRandom.System;

            double b1 = rnd.Next(-100, 100) / 10;
            double b2 = rnd.Next(-100, 100) / 10;
            double k1 = rnd.Next(-100, 100) / 10;
            double k2 = rnd.Next(-100, 100) / 10;

            if(k1 < 0.1 && k1 >= 0) k1 = 0.1;
            if(k1 > -0.1 && k1 < 0) k1 = -0.1;
            if(k2 < 0.1 && k2 >= 0) k2 = 0.1;
            if(k2 > -0.1 && k2 < 0) k2 = -0.1;

            double deviation1 = Math.Round(k1 * 8);
            double deviation2 = Math.Round(k2 * 8);

            for(int i = 0; i < 30; i++) {
                var isNegativeDelta = rnd.Next(0, 1) == 0;
                double delta1 = deviation1 * rnd.NextDouble();
                double delta2 = deviation2 * rnd.NextDouble();

                if(isNegativeDelta) {
                    delta1 = -delta1;
                    delta2 = -delta2;
                }

                double x1 = rnd.Next(1, 20);
                double x2 = rnd.Next(1, 20);
                double y1 = k1 * x1 + b1 + delta1;
                double y2 = k2 * x2 + b2 + delta2;

                yield return new { X1 = x1, Y1 = y1, X2 = x2, Y2 = y2 };
            }
        }
    }
}

#chart {
    height: 440px;
}