Chart from database

[Sunil]

Dear, 

I am building dynamic scatter line & dot chart from database with dynamic numbers of chart series. When i tried pre-configure chart series it working fine.

Class representation.

public class GraphSeriesPoint {
     public GraphSeriesPoint(double X, double Y, string Tooltip)
{ this.PointValueX = X;  this.PointValueY = Y; this.PointTooltip = Tooltip; }        public double PointValueX { get; set; }<br>        public double PointValueY { get; set; }<br>        public string PointTooltip { get; set; }<br>    }<br>    public class GraphSeries<br>    {<br>        public int SeriesID { get; set; }<br>        public string SeriesName { get; set; }<br>        public string SeriesColor { get; set; }<br>        public string SeriesDashType { get; set; }<br><br>        public List<GraphSeriesPoint> Points {get;set;}<br>    }<br>    public class GraphData<br>    {<br>        public int GraphID { get; set; }<br>        public string GraphTitle { get; set; }<br>        public string OperatingWindow { get; set; }<br>        public string OperatingEnvelop { get; set; }<br>        public string DesignEnvelop { get; set; }<br><br><br>        public string XTitle { get; set; }<br>        public double XMin { get; set; }<br>        public double XMax { get; set; }<br><br><br>        public string YTitle { get; set; }<br>        public double YMin { get; set; }<br>        public double YMax { get; set; }<br><br>        public List<GraphSeries> Lines { get; set; }<br>    }

[Sunil]

Dear, 

I am building dynamic scatter line chart from database with dynamic chart series. When i tried pre-configure (fix number of series) chart series it working fine. Can you help to get solution for this. 

Class representation.

//scatter chart configuration
public class GraphData
{
   public int GraphID { get; set; } //id
   public string GraphTitle { get; set; } //chart title

   public string XTitle { get; set; } //x-axis title text & min and max value<
   public double XMin { get; set; }
   public double XMax { get; set; }

   public string YTitle { get; set; } //y-axis title text & min and max value
   public double YMin { get; set; }
   public double YMax { get; set; }

   public List<GraphSeries> Lines { get; set; } //list of chart series
}

//Chart series
public class GraphSeries
{
    public int SeriesID { get; set; } //id
    public string SeriesName { get; set; } //series name
    public string SeriesColor { get; set; }
    public string SeriesDashType { get; set; }

    public List<GraphSeriesPoint> Points {get;set;} //list of series point
}

//Point of series
public class GraphSeriesPoint
{
   public double PointValueX { get; set; } //x-axis values
   public double PointValueY { get; set; } //y-axis values
   public string PointTooltip { get; set; } //point tooltip
}

 

I prepare object "GraphData" which has list of "GraphSeries" which has list of "GraphSeriesPoint" from database inside controller and controller returns JSON.

 

var builtUrl = "GetEquipmentGraphData?equipmentID=12";
 var dataSource = new kendo.data.DataSource({
  transport: {
           read: {
                url: builtUrl,
                dataType: "json"
                  }
                            },
  group: {
         field: "GraphSeries",
         dir: "asc"
  }
});
dataSource.read();
 var view = dataSource.view();
alert(view.length); //Always returns 0.

[Stefan]

Hello Sunil,

I can suggest checking our example for Scatter Chart bound to remote grouped data. Also, I can suggest checking the response from the server to observe the expected data format:

http://demos.telerik.com/kendo-ui/line-charts/grouped-data

As for the dynamic Chart, I can suggest checking the following resources:

http://www.telerik.com/forums/binding-chart-s-series-to-dynamic-data

http://jsfiddle.net/HRpL8/2/

http://jayeshgoyani.blogspot.bg/2013/05/how-to-add-multiple-lines-series.html

If additional assistance is needed, please provide a runnable example so I can inspect it locally.

Regards,
Stefan
Telerik by Progress