Relative xAxis Chart

[Flearz]

Hello, I am trying to plot 1000 values on a line chart, but I don't want a grid with 1000 label, I don't understand how to do that ? I have a chart from -5 to 0 in x and from +5 to -5 in y, but I only want a grid with 10 columns and 10 rows (So there will be some points (x,y) between two grid lines) For example, if my chart goes from -5 to 0 in x, and I add a point of value -4.5, I want it to go at the right place independently of its position in the array... I hope it's possible, I tried with ChartJs Blazor, and it's working, but I prefer your much more because we can modify the list of values and it's much faster. If you have the solution that would help me a lot :)

P.S. Can you also help me with this, I try to set multiple options in jsonstring, but the format isn't good. OptionsJsonString = "{\"animation\": {\"duration\": 0}},{\"scales\": {\"xAxes\": [{\"ticks\":{\"max\": 1, \"min\": -1}, {\"display\": false}}]}}";

Thanks! Henri

[stsrki]

To tell you the truth I'm really not sure. You can take a look here or try google for right options to set. I'm now in the middle of finishing v0.8.8 so if you don't manage to find the solution in the meantime I will see what I can do.

PS. Here is the fixed options(hopefully):

{\"animation\": {\"duration\": 0},\"scales\": {\"xAxes\": [{\"display\": false,\"ticks\": {\"max\": 1,\"min\": -1}}]}}

[Flearz]

Hello, thanks for your answer. I have tried to put a "Point" class in my linechart with two properties "x" and "y" to see if it working like explained in the link you provided but it is not. I think it's just a small thing to add to make it work like on the web site.

I tried this code but it's not using the "x" part, only "y" like if it was only a line chart of "double".

If you can check this when you will have time that would be wonderfully perfect ;-)

Thanks for your awesome work. dataset

List<Point> x = new List<Point>{ new Point(-0.5, 2), new Point(0, 1), new Point(-1, 2.5), new Point(-2, 2.5), new Point(-4, 3), new Point(-6, 3) } ;
                LineChartDataset<Point> dataset = new LineChartDataset<Point>
                {
                    Label = "",
                    Data= x,
                    BackgroundColor = data.BackgroundColor,
                    BorderColor = data.BorderColor,
                    Fill = false,
                    PointRadius = 0,
                    ShowLine = true,
                    BorderDash = new List<int> { }

                };
               lineChart.AddDataSet(dataset);

options lineChart.OptionsJsonString = "{\"elements\":{\"line\":{\"tension\": false}},\"legend\":{\"display\": false},\"animation\": {\"duration\": 0},\"scales\": {\"xAxes\": [{\"display\": true,\"ticks\": {\"max\": 0,\"min\": -5}}],\"yAxes\": [{\"display\": true,\"ticks\": {\"max\": 5,\"min\": -5}}]}}"; //Disable animation Point class

 public class Point
        {
           public Point(double _x, double _y)
            {
                x = _x;
                y = _y;
            }
            public double x { get; set; }
         public   double y { get; set; }
        }

[bugMaker-237]

Hello, Any updates on this issue

[stsrki]

This is more of a chartjs question and I'm not that familiar with it to know the right answer. The best answer is to google it: https://stackoverflow.com/questions/45725112/how-to-remove-gridlines-and-grid-labels-in-chartjs-radar

To define options easier I have added new property named OptionsObject instead of OptionsJsonString . It is available in Blazorise v0.9-preview2(from MyGet).

[ntemirov]

Hello. I have the same problem as @Flearz. To make it work we need to use type "scatter" instead of "line" - https://stackoverflow.com/questions/48081521/line-chart-with-x-y-point-data-displays-only-2-values But ChartType doesn't have this type. @stsrki, can you add support for "scatter" type? https://www.chartjs.org/docs/latest/charts/scatter.html

Thanks.

[stsrki]

@NazirTemirov This is already possible with Blazorise 0.9. I will release new preview version on MyGet probably by the end of week.

[stsrki]

v0.9 is out

[ntemirov]

@stsrki, can you explain how it works? I cannot find chart with type "scatter" and I cannot build chart with relative xAxis.

[stsrki]

@NazirTemirov You can see an example here: https://blazorise.com/docs/extensions/chart/#usage-1

Basically all you need is to apply struct with X and Y to TItem property, eg TItem="LiveDataPoint"

[ntemirov]

Thanks