dotnet highchart error, not showing data - c#

i just curious on how to get the specific data column based on database
string[] arrLabel = new string[dt.Rows.Count];
Object[] data = new Object[dt.Rows.Count];
Object[] dataDetail = new Object[dt.Rows.Count];
String[] detail = new String[dt.Rows.Count];
var returnObject = new List<object>();
var returnColumnList = new List<object>();
int i = 0;
foreach (DataRow item in dt.Rows)
{
for (int j = 0; j < 1; j++)
{
returnColumnList.Add(new object[] {item["ATT_WF_STATUS_2"], item["ATT_WF_STATUS_3"]});
}
dataDetail = returnColumnList.ToArray();
returnObject.Add(new object[] { item["DEPARTEMENT"],dataDetail[i]});
arrLabel[i] = ((string)item["DEPARTEMENT"]);
i++;
}
data = returnObject.ToArray();
this.data = data;
this.arrLabel = arrLabel;
however, the graphic using dotnet is not showing but like this.
when i inspect element using browser
$(document).ready(function() {
chartColumnDetail = new Highcharts.Chart({
chart: { renderTo:'chartColumnDetail_container', options3d: { alpha: 10, beta: 0, depth: 50, enabled: true, viewDistance: 25 }, plotShadow: false, type: 'column' },
credits: { enabled: false },
legend: { enabled: true, itemStyle: { color: '#2C3E50' } },
plotOptions: { column: { allowPointSelect: true, colorByPoint: true, cursor: 'pointer', dataLabels: { enabled: true, style: { font:'14px', fontWeight:'bold' } }, depth: 50, showInLegend: true } },
subtitle: { text: 'Grouped by Status' },
title: { text: 'Attendance Analytics From 01 January 2010 Until 15 December 2016' },
tooltip: { formatter: function(){ var sliceIndex =this.point.index; var sliceName = this.series.chart.axes[0].categories[sliceIndex]; return 'The value for <b>' + this.point.name + '</b> is <b>' + this.y +'</b>';} },
xAxis: { categories: ['DO-Advisory Department', 'EDP Department', 'Enterprise Infrastructure Services Department', 'Pre Sales Department', 'Sales Department 1', 'IO-DCOPS Department', 'Human Capital Department'], labels: { align: 'center', style: { font: 'bold 10px Verdana,sans-serif' } } },
yAxis: { min: 0, title: { text: 'Amount' } },
exporting: { buttons: { contextButton: { align: 'center', x: 350, y: -3 } }, enabled: true, scale: 5 },
series: [{ data: [['DO-Advisory Department', [15, 32]], ['EDP Department', [26, 5]], ['Enterprise Infrastructure Services Department', [8, 1]], ['Pre Sales Department',[ 1, 6]], ['Sales Department 1', [1, 3]], ['IO-DCOPS Department',[ 1, 0]], ['Human Capital Department',[1, 0]], name: 'Department' }]
});
});
is there any way to fix this problem ? thank you very much
Update :
i am taking this from sql database which has this similar conditionenter image description here
Another update:
this is full coding for this case
protected DataTable GetDataDetail()
{
SortedList sl = new SortedList();
DateTime dateFrom = DateTime.ParseExact(Request.Form[txtOldDate.UniqueID], "yyyy-MM-dd", null);
DateTime dateTo = DateTime.ParseExact(Request.Form[txtNewDate.UniqueID], "yyyy-MM-dd", null);
sl.Add("#DATE_FROM-date", dateFrom);
sl.Add("#DATE_TO-date", dateTo);
DataTable dt = new DataTable();
dateFromChart = dateFrom.ToString("dd MMMM yyyy", CultureInfo.InvariantCulture);
dateToChart = dateTo.ToString("dd MMMM yyyy", CultureInfo.InvariantCulture);
dt = bll.GetAttendanceAnalyticsBasedWfStatus(sl);
string[] arrLabel = new string[dt.Rows.Count];
Object[] data = new Object[dt.Rows.Count];
Object[] dataDetail = new Object[dt.Rows.Count];
var returnObject = new List<object>();
List<object[]> returnColumnList = new List<object[]>();
int i = 0;
foreach (DataRow item in dt.Rows)
{
for (int j = 0; j < 1; j++)
{
returnColumnList.Add(new object[] { item["DEPARTEMENT"], item["ATT_WF_STATUS_2"], item["ATT_WF_STATUS_3"] });
}
dataDetail = returnColumnList.ToArray();
returnObject.Add(new object[] { returnColumnList.Select(b => new { name = b.GetValue(0), data = returnColumnList.Select(y => y.GetValue(1) + "," + y.GetValue(2)).ToArray() }).ToArray() });
arrLabel[i] = ((string)item["DEPARTEMENT"]);
i++;
}
jsonSeries = new JavaScriptSerializer().Serialize(returnObject);
Response.Write(jsonSeries);
data = returnObject.ToArray();
this.data = data;
this.arrLabel = arrLabel;
return dt;
}
then the dotnetchart
protected void ColumnChartDetail()
{
GetDataDetail();
//Binding data to Chart
DotNet.Highcharts.Highcharts chartColumnDetail = new DotNet.Highcharts.Highcharts("chartColumnDetail").InitChart(new Chart
{
DefaultSeriesType = ChartTypes.Column
})
.SetOptions(new GlobalOptions
{
Colors = new[] {
ColorTranslator.FromHtml("#50B432"), //using system.drawing
ColorTranslator.FromHtml("#ED561B"),
ColorTranslator.FromHtml("#DDDF00"),
ColorTranslator.FromHtml("#24CBE5"),
ColorTranslator.FromHtml("#64E572"),
ColorTranslator.FromHtml("#FF9655"),
ColorTranslator.FromHtml("#34495E"),
ColorTranslator.FromHtml("#6AF9C4")
}
})
//set title
.SetTitle(new Title
{
Text = "Attendance Analytics From " + this.dateFromChart + " Until " + this.dateToChart,
})
//set subtitle
.SetSubtitle(new Subtitle
{
Text = "Grouped by Status",
})
//set tooltip
.SetTooltip(new Tooltip
{
Formatter = #"function(){ var sliceIndex = this.point.index; var sliceName = this.series.chart.axes[0].categories[sliceIndex]; return 'The value for <b>' + this.point.name + '</b> is <b>' + this.y +'</b>';}"
})
//Exporting options
.SetExporting(new Exporting
{
Enabled = true,
Scale = 5,
Buttons = new ExportingButtons
{
ContextButton = new ExportingButtonsContextButton
{
Align = HorizontalAligns.Center,
X = 350,
Y = -3
}
}
})
//set plot option
.SetPlotOptions(new PlotOptions
{
Column = new PlotOptionsColumn
{
AllowPointSelect = true,
Depth = 50,
DataLabels = new PlotOptionsColumnDataLabels
{
Enabled = true,
Style = "font:'14px', fontWeight:'bold'"
},
ShowInLegend = true,
ColorByPoint = true,
Cursor = Cursors.Pointer,
}
})
//set chart initial
.InitChart(new Chart
{
Type = ChartTypes.Column,
PlotBackgroundColor = null,
PlotBorderWidth = null,
PlotShadow = false,
Options3d = new ChartOptions3d // options for 3D
{
Enabled = true,
Alpha = 10,
Beta = 0,
Depth = 50,
ViewDistance = 25
}
})
//set xAxis formatter text
.SetXAxis(new XAxis
{
Categories = arrLabel,
Labels = new XAxisLabels
{
Style = "font: 'bold 10px Verdana,sans-serif'",
Align = HorizontalAligns.Center
}
})
//set yAxis formater text
.SetYAxis(new YAxis
{
Min = 0,
Title = new YAxisTitle { Text = "Amount" }
})
//remove watermark of highcharts
.SetCredits(new Credits
{
Enabled = false
})
//set Legend
.SetLegend(new Legend
{
Enabled = true,
ItemStyle = "color: '#2C3E50'"
})
//set Series
.SetSeries(new[]
{
new Series
{
Name = "Department",
Data = new Data(data)
},
});
chartContainerColumnDetail.Text = chartColumnDetail.ToHtmlString();
}
after added code, the result become like this
[[[{"name":"DO-Advisory Department","data":["15,32"]}]],[[{"name":"DO-Advisory Department","data":["15,32","11,18"]},{"name":"EDP Department","data":["15,32","11,18"]}]],[[{"name":"DO-Advisory Department","data":["15,32","11,18","8,1"]},{"name":"EDP Department","data":["15,32","11,18","8,1"]},{"name":"Enterprise Infrastructure Services Department","data":["15,32","11,18","8,1"]}]],[[{"name":"DO-Advisory Department","data":["15,32","11,18","8,1","1,6"]},{"name":"EDP Department","data":["15,32","11,18","8,1","1,6"]},{"name":"Enterprise Infrastructure Services Department","data":["15,32","11,18","8,1","1,6"]},{"name":"Pre Sales Department","data":["15,32","11,18","8,1","1,6"]}]],[[{"name":"DO-Advisory Department","data":["15,32","11,18","8,1","1,6","1,3"]},{"name":"EDP Department","data":["15,32","11,18","8,1","1,6","1,3"]},{"name":"Enterprise Infrastructure Services Department","data":["15,32","11,18","8,1","1,6","1,3"]},{"name":"Pre Sales Department","data":["15,32","11,18","8,1","1,6","1,3"]},{"name":"Sales Department 1","data":["15,32","11,18","8,1","1,6","1,3"]}]],[[{"name":"DO-Advisory Department","data":["15,32","11,18","8,1","1,6","1,3","1,0"]},{"name":"EDP Department","data":["15,32","11,18","8,1","1,6","1,3","1,0"]},{"name":"Enterprise Infrastructure Services Department","data":["15,32","11,18","8,1","1,6","1,3","1,0"]},{"name":"Pre Sales Department","data":["15,32","11,18","8,1","1,6","1,3","1,0"]},{"name":"Sales Department 1","data":["15,32","11,18","8,1","1,6","1,3","1,0"]},{"name":"IO-DCOPS Department","data":["15,32","11,18","8,1","1,6","1,3","1,0"]}]],[[{"name":"DO-Advisory Department","data":["15,32","11,18","8,1","1,6","1,3","1,0","1,0"]},{"name":"EDP Department","data":["15,32","11,18","8,1","1,6","1,3","1,0","1,0"]},{"name":"Enterprise Infrastructure Services Department","data":["15,32","11,18","8,1","1,6","1,3","1,0","1,0"]},{"name":"Pre Sales Department","data":["15,32","11,18","8,1","1,6","1,3","1,0","1,0"]},{"name":"Sales Department 1","data":["15,32","11,18","8,1","1,6","1,3","1,0","1,0"]},{"name":"IO-DCOPS Department","data":["15,32","11,18","8,1","1,6","1,3","1,0","1,0"]},{"name":"Human Capital Department","data":["15,32","11,18","8,1","1,6","1,3","1,0","1,0"]}]]]

Update 2:
Can u form the data result like this :
List<object[]> returnColumnList = new List<object[]>();
string json = string.Empty;
var returnObject = new List<object>();
returnColumnList.Add(new object[] { "Depart" , "123", "345" });
returnColumnList.Add(new object[] { "Depart", "123", "345" });
foreach (var item in returnColumnList)
{
returnObject.Add(new {name = item.GetValue(0), data = (new object[] {item.GetValue(1) , item.GetValue(2)})});
}
json = new JavaScriptSerializer().Serialize(returnObject);
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
List item
The Series is not set properly.
Please do it this way :
series: [{
name: 'DO-Advisory Department',
data: [15, 32]
}, {
name: 'EDP Department',
data: [26, 5]
}, {
name: 'Enterprise Infrastructure Services Department',
data: [8, 1]
}]
Have attached the image of results.

Related

GroupBy bool and Select values for new list

I am trying to get into more complex Linq queries and right away catch a point I am feeling stuck. I have a following list in DB:
ID ELAPSED TIME APPISRUNNING
1 12 TRUE
2 54 TRUE
3 32 FALSE
Where ELAPSED TIME is TimeSpan and APPISRUNNING is a bool.
I would like to build a chart based on these values (https://github.com/beto-rodriguez/LiveCharts2). Chart build fine with this:
Title = "Analytics";
this.ActivityChartSeries = new ISeries[]
{
new PieSeries<double> { Values = new double[] { 2 }},
new PieSeries<double> { Values = new double[] { 2 }},
new PieSeries<double> { Values = new double[] { 2 }},
new PieSeries<double> { Values = new double[] { 2 }},
new PieSeries<double> { Values = new double[] { 2 }},
};
Now I somehow need to first GroupBy bool and then select a new List? I have tried following:
IEnumerable<DataRecord> dataRecords = await this.DataStore.GetItemsAsync();
this.ActivityChartSeries = dataRecords
.GroupBy(g => g.AppIsRunning)
.Select(m => new
{ // BELOW IS TOTALLY UNCLEAR FOR ME
Values = m.Select(r => r.EngineElapsed.Ticks),
Name = m.Select(r => r.Name),
})
.Select(x =>
new PieSeries<double>
{
Values = new List<double> { x.Values.FirstOrDefault() },
Name = x.Name.FirstOrDefault(),
});
Type of assigned variable:
public IEnumerable<ISeries> ActivityChartSeries
This part is totally unclear for me:
Values = m.Select(r => r.EngineElapsed.Ticks),
Name = m.Select(r => r.Name),
How after GroupBy I can create two types of data? Basically I need
"Application Running" and "Values"
"Application is not Running" and "Values"
EDIT:
Code provided by Somar Zein compiles fine:
var results = activityChartSeries
.GroupBy(a=> a.AppIsRunning)
.Select(item=> new PieSeries<double>{
Name = item.Key ? "Application is Running" : "Application is not Running",
Values = item.Select(x=> Convert.ToDouble(x.ElapsedTime.Ticks)).ToList()
});
However as a result I am getting something like this, why it is reloading in a loop?
Here is result:
enter image description here
EDIT2:
So I have created an example for testing purposes:
Class:
public class DataModel
{
public int Id { get; set; }
public TimeSpan ElapsedTime { get; set; }
public bool AppIsRunning { get; set; }
}
Code:
List<DataModel> records = new List<DataModel>();
records.Add(new DataModel { Id = 1, ElapsedTime = new TimeSpan(1, 20, 30), AppIsRunning = true });
records.Add(new DataModel { Id = 2, ElapsedTime = new TimeSpan(1, 20, 30), AppIsRunning = true });
records.Add(new DataModel { Id = 3, ElapsedTime = new TimeSpan(1, 20, 30), AppIsRunning = true });
records.Add(new DataModel { Id = 4, ElapsedTime = new TimeSpan(1, 20, 30), AppIsRunning = true });
records.Add(new DataModel { Id = 5, ElapsedTime = new TimeSpan(1, 20, 30), AppIsRunning = true });
this.ActivityChartSeries = records
.GroupBy(g => g.AppIsRunning)
.Select(item => new PieSeries<double>
{
Name = item.Key ? "Running" : "Not Running",
Values = new double[] { 2, 4 },
});
I get the same reloading effect, even thou originally provided Example from LiveCharts work fine.
you could try doing something like following:
var results = activityChartSeries
.GroupBy(a=> a.AppIsRunning)
.Select(item=> new PieSeries<double>{
Name = item.Key ? "Application is Running" : "Application is not Running",
Values = item.Select(x=> Convert.ToDouble(x.ElapsedTime.Ticks)).ToList()
});
hope that could be helpful!

WPF Pie Chart how to add space between slices?

I am using Telerik (RadPieChart) with WPF. How can I add space between the slices ?
This is what I currently have:
And this is how I want my Pie chart to look like with the spaces between the slices:
Here is my source code:
private DoughnutSeries CreateDognutSerie(KeyValuePair<ChartSerie, List<ChartDataPoint>> chartSerie, int index, int count)
{
double spaceBetweenSperies = 0.0;
if (count > 1 && index != count - 1)
{
spaceBetweenSperies = 0.007;
}
var doughnutSerie = new DoughnutSeries()
{
ShowLabels = true,
//LabelConnectorsSettings = new ChartSeriesLabelConnectorsSettings()
//{
//},
InnerRadiusFactor = index / (double)count,
RadiusFactor = ((index + 1) / (double)count) - spaceBetweenSperies,
//LegendSettings = new DataPointLegendSettings()
//{
//},
//SeriesAnimation = new PieChartAngleRangeAnimation()
//{
// InitialStartAngle = -90,
// InitialSweepAngle = 180,
// Duration = new TimeSpan(0, 0, 0, 0, 800),
//}
};
foreach (ChartDataPoint serie in chartSerie.Value)
{
doughnutSerie.DataPoints.Add(new PieDataPoint()
{
Label = serie.XPoint.Label,
Value = Math.Abs((double?)serie.Value ?? 0),
});
}
return doughnutSerie;
}
Use the OffsetFromCenter property in PieDataPoint. Something like OffsetFromCenter = 0.015 should be similar to the above image.
public MainWindow()
{
InitializeComponent();
var data = new Dictionary<string, double>
{
{ "January", 5 },
{ "February", 3 },
{ "March", 5 },
{ "April", 7 },
{ "May", 2 },
{ "June", 11 },
{ "July", 11 },
{ "August", 11 },
{ "September", 11 },
{ "October", 11 },
{ "November", 11 },
{ "December", 12 },
};
var series = CreateDougnutSeries(data);
var pie = new RadPieChart { Palette = ChartPalettes.Fluent };
pie.Series.Add(series);
mainGrid.Children.Add(pie);
}
private DoughnutSeries CreateDougnutSeries(Dictionary<string, double> data)
{
var doughnutSeries = new DoughnutSeries
{
ShowLabels = true,
InnerRadiusFactor = 0,
RadiusFactor = 1
};
foreach (var point in data)
{
doughnutSeries.DataPoints.Add(new PieDataPoint()
{
Label = point.Key,
Value = point.Value,
OffsetFromCenter = 0.015
});
}
return doughnutSeries;
}
Increasing OffsetFromCenter to say 0.1 will render thicker lines:

How to create area range chart

I want to create area range chart as given in the following link
I want to add data to ranges using loop on my data. What should be the type of the ranges to create chart?
Please suggest. Thanks in advance. Here's the JSFiddle code:
HTML:
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/highcharts-more.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
JS:
$(function () {
var ranges = [[1246406400000,33,22],[1246492800000,24,12],[1246579200000,15,1],[1246665600000,28,17],[1246752000000,22,12],[1246838400000,34,22],[1246924800000,30,19],[1247011200000,27,15],[1247097600000,35,24],[1247184000000,29,14],[1247270400000,32,20],[1247356800000,32,21],[1247443200000,34,23],[1247529600000,19,9],[1247616000000,31,21],[1247702400000,22,7],[1247788800000,25,11],[1247875200000,19,6],[1247961600000,33,18],[1248048000000,33,18],[1248134400000,21,7],[1248220800000,31,19],[1248307200000,25,15],[1248393600000,29,19],[1248480000000,34,23],[1248566400000,21,9],[1248652800000,27,12],[1248739200000,19,4],[1248825600000,32,19],[1248912000000,32,20],[1248998400000,16,1]], ranges2 = [[1246406400000,22,-22],[1246492800000,12,-12],[1246579200000,1,-1],[1246665600000,17,-17],[1246752000000,12,-12],[1246838400000,22,-22],[1246924800000,19,-19],[1247011200000,15,-15],[1247097600000,24,-24],[1247184000000,14,-14],[1247270400000,20,-20],[1247356800000,21,-21],[1247443200000,23,-23],[1247529600000,9,-9],[1247616000000,21,-21],[1247702400000,7,-7],[1247788800000,11,-11],[1247875200000,6,-6],[1247961600000,18,-18],[1248048000000,18,-18],[1248134400000,7,-7],[1248220800000,19,-19],[1248307200000,15,-15],[1248393600000,19,-19],[1248480000000,23,-23],[1248566400000,9,-9],[1248652800000,12,-12],[1248739200000,4,-4],[1248825600000,19,-19],[1248912000000,20,-20],[1248998400000,1,-1]], ranges3 = [[1246406400000,-22,-45],[1246492800000,-12,-30],[1246579200000,-1,-17],[1246665600000,-17,-43],[1246752000000,-12,-40],[1246838400000,-22,-45],[1246924800000,-19,-43],[1247011200000,-15,-45],[1247097600000,-24,-50],[1247184000000,-14,-37],[1247270400000,-20,-44],[1247356800000,-21,-42],[1247443200000,-23,-42],[1247529600000,-9,-37],[1247616000000,-21,-40],[1247702400000,-7,-24],[1247788800000,-11,-27],[1247875200000,-6,-27],[1247961600000,-18,-34],[1248048000000,-18,-46],[1248134400000,-7,-36],[1248220800000,-19,-48],[1248307200000,-15,-30],[1248393600000,-19,-49],[1248480000000,-23,-50],[1248566400000,-9,-38],[1248652800000,-12,-27],[1248739200000,-4,-26],[1248825600000,-19,-45],[1248912000000,-20,-40],[1248998400000,-1,-17]];
$('#container').highcharts({
title: {
text: 'Sentiment Flood Map'
},
xAxis: {
type: 'datetime'
},
yAxis: {
title: {
text: null
}
},
tooltip: {
crosshairs: true,
shared: true,
valueSuffix: ''
},
legend: {
},
series: [ {
name: 'Positive',
data: ranges,
type: 'arearange',
lineWidth: 0,
linkedTo: ':previous',
color: Highcharts.getOptions().colors[2],
fillOpacity: 0.8,
zIndex: 0
}
, {
name: 'Neutral',
data: ranges2,
type: 'arearange',
lineWidth: 0,
linkedTo: ':previous',
color: Highcharts.getOptions().colors[1],
fillOpacity: 0.8,
zIndex: 0
}
, {
name: 'Negative',
data: ranges3,
type: 'arearange',
lineWidth: 0,
linkedTo: ':previous',
color: Highcharts.getOptions().colors[3],
fillOpacity: 0.8,
zIndex: 0
}
]
});
});
Here is an example the produces a Chart graphic just like the one in the linked image.
Note: After I have created a few testdata I calculate a dummy series with a transparent color that will make the whole data stack up so that the median of the "neutral" series sits nicely on one horizontal line.
int numPoints = 30; // create some test data
List<int> neutralData = new List<int>();
List<int> negativeData = new List<int>();
List<int> positiveData = new List<int>();
List<int> dummyData = new List<int>();
for (int i = 0; i < numPoints; i++)
{
// the real data series, using a Random R:
positiveData.Add(R.Next(i + 22));
neutralData .Add(R.Next(i + 33));
negativeData.Add(R.Next(i + 44));
// calculate the transparent bottom series:
dummyData.Add( - neutralData[i] / 2 - negativeData[i]);
}
// set up the Chart:
chart1.ChartAreas.Add("StackedArea"); // if necessary
Series s0 = chart1.Series.Add(" ");
Series s1 = chart1.Series.Add("negative");
Series s2 = chart1.Series.Add("neutral");
Series s3 = chart1.Series.Add("positive");
foreach (Series s in chart1.Series) s.ChartType = SeriesChartType.StackedArea;
s0.Color = Color.Transparent;
s1.Color = Color.FromArgb(200, Color.Red);
s2.Color = Color.FromArgb(200, Color.LightSlateGray);
s3.Color = Color.FromArgb(200, Color.Green)
// now add the data points:
for (int i = 0; i < numPoints; i++)
{
s0.Points.AddXY(i, dummyData[i]);
s1.Points.AddXY(i, negativeData[i] );
s2.Points.AddXY(i, neutralData [i]);
s3.Points.AddXY(i, positiveData[i]);
}
If you want to show a tooltip similar to the one from your example you can add this to the AddXY loop:
int a2 = dummyData[i] + negativeData[i];
int a3 = a2 + neutralData[i];
int a4 = a3 + positiveData[i];
string tt = string.Format( "Data Point {0}\r\nPositive: {1} - {2}\r\n"
+ "Neutral: {2} - {3}\r\nNegative: {3} - {4}", i, a4, a3, a2, dummyData[i]);
s1.Points[i].ToolTip = tt;
s2.Points[i].ToolTip = tt;
s3.Points[i].ToolTip = tt;
Here is an example image:
You can not create a chart exactly like the one shown in link but you can use different series on your chart. I am posting the code that creates a chart and populates it with 2 series, you can add as many series as you want.
DataSet dataSet;
ConnectionClass.GetInstance().connection_string = Properties.Settings.Default.MindMuscleConnectionString;
ConnectionClass.GetInstance().Sql = "Select Count(MemberInfo.memberName) as 'Members', CompetitionName as 'Competition' FROM MemberInfo, MemberBodyInfo, Competition WHERE MemberInfo.memberID = MemberBodyInfo.memberID AND MemberBodyInfo.weight >= Competition.CompetitionCategory and MemberBodyInfo.weight <= Competition.CompetitionCategory + 5 group by CompetitionName;";
dataSet = ConnectionClass.GetInstance().GetConnection;
chart1.Series["Series1"].Name = "Members";
chart1.Series["Members"].YValueMembers = "Members";
chart1.Series["Members"].XValueMember = "Competition";
chart1.Series.Add("Members2");
chart1.Series["Members2"].ChartType = SeriesChartType.StackedArea;
chart1.Series["Members2"].IsValueShownAsLabel = true;
chart1.Series["Members2"].YValueMembers = "Members";
chart1.Series["Members2"].XValueMember = "Competition";
this.chart1.Titles.Add("Competition Participants"); // Set the chart title
chart1.Series["Members"].ChartType = SeriesChartType.StackedArea;
chart1.Series["Members"].IsValueShownAsLabel = true; // To show chart value
chart1.DataSource = dataSet;
chart1.DataBind();
I have not actually created a new series from some different data... Both series are same here but I have just showed you an example.

MVC 4 C# How to create a method that returns a list<object>

I am using EF and seeding our DB with some product data. The data with which I'm seeding has a part which will be repeated about 100 times. Rather than copy and paste my code I would rather populate my list with a method but as I am a newbie, I cannot seem to make this work properly:
Here is the code in context:
context.Products.AddOrUpdate(
pr => pr.Name,
new Product
{
Name = "3.5x5",
ProductCategoryId = 1,
ProductSubCategoryId1 = 1,
ProductSubCategoryId2 = 3,
VendorId = 1,
HeightUnitId = 2,
Height = (decimal)3.5,
Width = 5,
ProductOptions =
new List<ProductOption>
{
new ProductOption { Name = "Paper", InputTypeSingleOptionId = 1, InputTypeMultipleOptionId = 2, SortOrder = 1,
ProductOptionsDetails =
new List<ProductOptionsDetail>
{
new ProductOptionsDetail { Name = "Glossy", Value = "Glossy", IsDefault = true, SortOrder = 1 },
new ProductOptionsDetail { Name = "Matte", Value = "Matte", IsDefault = false, SortOrder = 2 },
new ProductOptionsDetail { Name = "Metallic", Value = "Metallic", IsDefault = false, SortOrder = 3 },
new ProductOptionsDetail { Name = "Lustre", Value = "Lustre", IsDefault = false, SortOrder = 4 }
}
},
new ProductOption { Name = "Color", InputTypeSingleOptionId = 1, InputTypeMultipleOptionId = 2, SortOrder = 2,
ProductOptionsDetails =
new List<ProductOptionsDetail>
{
new ProductOptionsDetail { Name = "Color", Value = "Color", IsDefault = true, SortOrder = 1 },
new ProductOptionsDetail { Name = "Black and white", Value = "Black and White", IsDefault = false, SortOrder = 2 },
new ProductOptionsDetail { Name = "Sepia", Value = "Sepia", IsDefault = false, SortOrder = 3 }
}
},
new ProductOption { Name = "Texture", InputTypeSingleOptionId = 1, InputTypeMultipleOptionId = 2, SortOrder = 3,
ProductOptionsDetails =
new List<ProductOptionsDetail>
{
new ProductOptionsDetail { Name = "None", Value = "None", IsDefault = true, SortOrder = 1 },
new ProductOptionsDetail { Name = "Linen texture", Value = "Linen", IsDefault = false, SortOrder = 2 },
new ProductOptionsDetail { Name = "Canvas texture", Value = "Canvas", IsDefault = false, SortOrder = 3 },
new ProductOptionsDetail { Name = "Watercolor texture", Value = "Canvas", IsDefault = false, SortOrder = 4 },
new ProductOptionsDetail { Name = "Pebble texture", Value = "Pebble", IsDefault = false, SortOrder = 5 }
}
},
new ProductOption { Name = "Coating", InputTypeSingleOptionId = 1, InputTypeMultipleOptionId = 2, SortOrder = 4,
ProductOptionsDetails =
new List<ProductOptionsDetail>
{
new ProductOptionsDetail { Name = "None", Value = "None", IsDefault = true, SortOrder = 1 },
new ProductOptionsDetail { Name = "Linen texture", Value = "Linen", IsDefault = false, SortOrder = 2 },
new ProductOptionsDetail { Name = "Canvas texture", Value = "Canvas", IsDefault = false, SortOrder = 3 },
new ProductOptionsDetail { Name = "Watercolor texture", Value = "Canvas", IsDefault = false, SortOrder = 4 },
new ProductOptionsDetail { Name = "Pebble texture", Value = "Pebble", IsDefault = false, SortOrder = 5 }
}
}
}
},
The part I would like to return from a method would be something like:
ProductOptions = getOptions() All that nested code can be repeated verbatim. I have tried working from some other examples but I keep on getting errors in Visual Studio. If I could get a very basic approach to this, that would be greatly appreciated.
public List<ProductOptionsDetail> GetOptions() {
return new List<ProductOptionsDetail>()
{
new ProductOptionsDetail() { Name = "None", Value = "None", IsDefault = true, SortOrder = 1 },
new ProductOptionsDetail() { Name = "Linen texture", Value = "Linen", IsDefault = false, SortOrder = 2 },
new ProductOptionsDetail() { Name = "Canvas texture", Value = "Canvas", IsDefault = false, SortOrder = 3 },
new ProductOptionsDetail() { Name = "Watercolor texture", Value = "Canvas", IsDefault = false, SortOrder = 4 },
new ProductOptionsDetail() { Name = "Pebble texture", Value = "Pebble", IsDefault = false, SortOrder = 5 }
};
}

Repeated values in x axis in dotnet highchart controls

I m facing problem with dotnet highcharts controls the problem is the values in x axis are repeating i.e. 0 0 1 1 2 2 3 3 4 4 5 5. Please help
below is my code.
Javascript code
<div id='ContentAvailabilty_container'></div>
<script type='text/javascript'>
var ContentAvailabilty;
$(document).ready(function() {
ContentAvailabilty = new Highcharts.Chart({
chart: { renderTo:'ContentAvailabilty_container', type: 'bar' },
legend: { enabled: false, layout: 'horizontal' },
plotOptions: { bar: { borderWidth: 0 } },
title: { text: 'Content Availabilty' },
xAxis: { categories: ['#Rest of Published', '#Published Queue', '#Rest of Unpublished', '#Unpublished Queue', '#New Approved'] },
yAxis: { labels: { formatter: function() { return Highcharts.numberFormat(this.value, 0); } }, min: 0, title: { text: '' } },
series: [{ data: [5, 0, 0, 0, 0] }]
});
});
</script>
DOT NET CODE
DotNet.Highcharts.Highcharts currentReport = new DotNet.Highcharts.Highcharts("ContentAvailabilty");
currentReport.InitChart(new Chart { Type = ChartTypes.Bar });
currentReport.SetTitle(new Title { Text = "Content Availabilty" });
currentReport.SetXAxis(new XAxis
{
Categories = new[] { "#Rest of Published", "#Published", "#Rest of Unpublished", "#Unpublished", "#Approved" }
});
currentReport.SetYAxis(new YAxis
{
Title = new XAxisTitle { Text = "" }
, Labels = new XAxisLabels { Formatter = "function() { return Highcharts.numberFormat(this.value, 0); }" }//function to convert 4k to 4000
,Min=0
});
currentReport.SetLegend(new Legend { Enabled = false });
currentReport.SetPlotOptions(new PlotOptions { Bar = new PlotOptionsBar { BorderWidth=0} });
currentReport.SetSeries(new Series[] {
new Series{
Data = new Data( new object[]{ RestofPublished, publishedQueue, Rest_of_UnPublished, UnPublished_Queue, newApproved } )
}
});
ReportContainerLabel.Text = string.Empty;
ReportContainerLabel.Text = currentReport.ToHtmlString();
xAxis : [{categories : []}], // when defining X-Axis
chart.xAxis[0].setCategories(JSON_object); // when parsing data ,from another method ,
if you want to use categories X-Axis or Y-Axis ? .bcoz the code and the chart image confusing me , any way if you want to set the categories by manually , then initially make categories as null , and assigned a array to it by using JQuery , if you loading dynamic data , then there should be a parsed json object or something semilar

Categories

Resources