Line marker from database

[Chris Iverson]

The chart is generated from a table in our database using the following code:

XAML

<ej:Chart ID="Chart1" runat="server" Height="600">

                <Series>

                    <ej:Series Name="Backlog" Type="Line" XName="Day"  YName="Backlog" Fill="#FF3333"></ej:Series>

                </Series>

                <Series>

                    <ej:Series Name="Total" Type="Line" XName="Day"  YName="Total" Fill="#336AFF"></ej:Series>

                </Series>

                <Series>

                    <ej:Series Name="Resolved" Type="Line" XName="Day" YName="Resolved" Fill="#009900"> </ej:Series>

                </Series>

                <Series>

                    <ej:Series Name="Target" Type="Line" XName="Day" YName="Average" Fill="#000000" Width="3" DashArray="2,3">

                       

                    </ej:Series>

                </Series>

                <PrimaryXAxis DesiredIntervals="40" MaximumLabelWidth="34" LabelIntersectAction="Rotate90" RangePadding="Auto"><Title Offset="0"></Title></PrimaryXAxis>

                <PrimaryYAxis RangePadding="Auto"></PrimaryYAxis>

                

                <Crosshair Visible="true" Type="Trackball"></Crosshair>

                

                <Legend Visible="true" Position="Bottom" Alignment="Near"></Legend>

            </ej:Chart>

From the Code behind

 private void RunCharts()

        {

            _db.Clear();

            Query();

            var full = new List<FullChartData>();

full.Clear();

double rfull = 0;

foreach (var i in GetFullMetrics())

            {

                if (Convert.ToDouble(i[4]) != 0)

                    rfull = Convert.ToDouble(i[4]);

                full.Add(new FullChartData(Convert.ToString(i[0]), Convert.ToDouble(i[1]), Convert.ToDouble(i[2]), Convert.ToDouble(i[3]), rfull, Convert.ToDouble(i[5]), Convert.ToDouble(i[6])));

            }

}

   public class FullChartData

        {

            public string Day;

            public double Open;

            public double Frozen;

            public double Backlog;

            public double Resolved;

            public double Total;

            public double Average;

            public FullChartData(string day, double open, double frozen, double backlog, double resolved, double total, double average)

            {

                Day = day;

                Open = open;

                Frozen = frozen;

                Backlog = backlog;

                Resolved = resolved;

                Total = total;

                Average = average;

            }

        }

How would I add data markers for data listed on a separate table to specific points on the chart?

[Baby Palanidurai]

Hi Chris,

 

Thanks for using syncfusion products,

 

We have analyzed your query and as per your requirement we have prepared sample. In that sample we are getting data from list. We are creating two list, one for chart series data binding and another one for customizing specific markers points. Using symbolRendering event, we can cancel or render the marker for specific point. In this sample, we are rendering marker for the points that are present in both 1 and 2 lists

 

Please find the below code snippet to achieve this requirement,

 

   

         var datacollection = '<%= data2 %>';

          datacollection = JSON.parse(datacollection);

          var load = function (args) {

          }

          var preRender = function (args) {

              count = 0;

              for (var j = 0; j < datacollection.length; j++) {

                  for (var i = 0; i < args.model.series[0].points.length; i++) {

                      if ((args.model.series[0].points[i].x === datacollection[j].Xvalue) && (args.model.series[0].points[i].y === datacollection[j].YValue1)) {

                          dataIndex.push(i);

                      }

                  }

              }

          }

          var symbolRendering = function (args) {

              var check = true;

              for (var j = 0; j < dataIndex.length; j++) {

                  if (count === +dataIndex[j]) {

                      check = false;

                  }              

              }

              if (check) {

                      args.cancel = true 

               }

              count++;

          }

 

Screenshot:

Sample for your reference can be find from below link,

 http://www.syncfusion.com/downloads/support/directtrac/general/ze/SyncfusionASPNETApplication1475180153.zip 

 

If the sample doesn’t meet your requirement, kindly revert us with more information on the query.

 

 

Thanks,

Baby.