public IViewComponentResult Invoke()
{
// Ref: https://www.chartjs.org/docs/latest/
var chartData = @"
{
type: 'bar',
responsive: true,
data:
{
labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
},
options:
{
scales:
{
yAxes: [{
ticks:
{
beginAtZero: true
}
}]
}
}
}";
var chart = JsonConvert.DeserializeObject <ChartJs>(chartData);
var chartModel = new ChartJsViewModel
{
Chart = chart,
ChartJson = JsonConvert.SerializeObject(chart, new JsonSerializerSettings
{
NullValueHandling = NullValueHandling.Ignore,
})
};
return(View(chartModel));
}
public IViewComponentResult Invoke()
{
var chartData = @"{
type: 'bar',
data: {
labels: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
datasets: [{
label: '# of Errors',
data: [12, 19, 3, 5, 2, 3,8],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)',
'rgba(255, 59, 64, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)',
'rgba(255, 59, 64, 1)'
],
borderWidth: 1
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero: true
}
}]
}
}
}";
var chart = JsonConvert.DeserializeObject <BizTalk.Monitor.Web.Models.ChartTypes.ChartJs>(chartData);
var chartModel = new ChartJsViewModel
{
Chart = chart,
ChartJson = JsonConvert.SerializeObject(chart, new JsonSerializerSettings
{
NullValueHandling = NullValueHandling.Ignore
})
};
return(View(chartModel));
}
//public IViewComponentResult Invoke(string chartData)
//{
// // Ref: https://www.chartjs.org/docs/latest/
// ChartJS chart = JsonConvert.DeserializeObject<ChartJS>(chartData);
// var chartModel = new ChartJsViewModel
// {
// Chart = chart,
// ChartJson = JsonConvert.SerializeObject(chart, new JsonSerializerSettings
// {
// NullValueHandling = NullValueHandling.Ignore
// })
// };
// return View(chartModel);
//}
public IViewComponentResult Invoke(ChartJS chart)
{
// Ref: https://www.chartjs.org/docs/latest/
string teste = JsonConvert.SerializeObject(chart, new JsonSerializerSettings
{
NullValueHandling = NullValueHandling.Ignore
});
var chartModel = new ChartJsViewModel
{
Chart = chart,
ChartJson = JsonConvert.SerializeObject(chart, new JsonSerializerSettings
{
NullValueHandling = NullValueHandling.Ignore
})
};
return(View(chartModel));
}
public IViewComponentResult Invoke()
{
var chartData = @"
{
type: 'line',
responsive: true,
data:
{
labels: ['Monday', 'Tuesday', 'Wednesday','Thursday', 'Friday', 'Saturday', 'Sunday'],
datasets: [{
label: 'Weekly Sale',
data: [12000, 19000, 3000, 5000, 2000, 3000,6000],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
},
options:
{
scales:
{
yAxes: [{
ticks:
{
beginAtZero: true
}
}]
}
}
}";
var chart = JsonConvert.DeserializeObject <ChartJs>(chartData);
var chartModel = new ChartJsViewModel
{
Chart = chart,
ChartJson = JsonConvert.SerializeObject(chart, new JsonSerializerSettings
{
NullValueHandling = NullValueHandling.Ignore
})
};
return(View(chartModel));
}
public IViewComponentResult Invoke(Dictionary <string, decimal?> chart)
{
JArray colors = new JArray();
JArray borderColor = new JArray();
string[] labels = chart.Keys.ToArray();
decimal?[] data = chart.Values.ToArray();
double k = labels.Length > 300 ? 4 : 1;
if (data.Length > 0)
{
if (data[0] > data[data.Length - 1])
{
colors.Add("rgba(230, 74, 25, 0.2)");
borderColor.Add("rgba(230, 74, 25, 1)");
}
else
{
colors.Add("rgba(15, 157, 88, 0.2)");
borderColor.Add("rgba(15, 157, 88, 1)");
}
}
var chartData = @"
{
type: 'line',
responsive: true,
data:
{
labels:" + new JArray(labels) + @",
datasets: [{
label: '',
lineTension: 0,
data:" + new JArray(data) + @",
backgroundColor:" + colors + @",
borderColor:" + borderColor + @",
borderWidth: 2
}]
},
options:
{
scales:
{
x: {
display: true,
scaleLabel:
{
display: true
},
ticks:
{
beginAtZero: false
}
},
xAxes: [{
ticks:
{
maxRotation: 0,
minRotation: 0,
callback: function(tick, index, array) {
return (index % " + k + @") ? '' : tick;
}
}
}],
y: {
ticks:
{
beginAtZero: false,
display: true
},
scaleLabel:
{
display: true,
labelString: 'Slow SQL Queries'
}
}
},
elements: {
point:{
radius: 0
}
},
legend: {
display: false
},
tooltips: {
enabled: true,
callbacks: {
label: function(tooltipItem, data) {
var label = data.datasets[tooltipItem.datasetIndex].label || '';
if (label) {
label += ': ';
}
label += Math.round(tooltipItem.yLabel * 100) / 100;
return label;
}}
}
}
}";
var chartModel = new ChartJsViewModel
{
ChartJson = chartData
};
return(View(chartModel));
}
public IViewComponentResult Invoke()
{
// var chart = JsonConvert.DeserializeObject<ChartJs> (chartData);
Ticks ticks = new Ticks {
beginAtZero = true
};
Yax yax = new Yax {
ticks = ticks
};
Yax[] y = new Yax[1];
y[0] = yax;
Scales scales = new Scales();
scales.yAxes = y;
Data data = new Data();
YearlySaleData saleData = GetYearlySaleData();
Dataset dataset = new Dataset
{
borderWidth = 1,
label = "Yearly Sale",
data = saleData.Amount.ToArray(),
backgroundColor = new string[] {
"rgba(255, 99, 132, 0.2)",
"rgba(54, 162, 235, 0.2)",
"rgba(255, 206, 86, 0.2)",
"rgba(75, 192, 192, 0.2)",
"rgba(153, 102, 255, 0.2)",
"rgba(54, 162, 235, 0.2)",
"rgba(255, 203, 83, 0.2)",
"rgba(255, 159, 64, 0.2)"
},
borderColor = new string[] {
"rgba(255, 99, 132, 1)",
"rgba(54, 162, 235, 1)",
"rgba(255, 206, 86, 1)",
"rgba(75, 192, 192, 1)",
"rgba(153, 102, 255, 1)",
"rgba(255, 203, 83, 1)",
"rgba(153, 102, 255, 1)",
"rgba(255, 203, 83, 1)",
"rgba(255, 159, 64, 1)"
}
};
ChartJs chart = new ChartJs
{
type = "bar",
responsive = true,
options = new Options {
scales = scales
},
data = new Data {
datasets = new Dataset[] { dataset }, labels = saleData.Year.ConvertAll <string>(delegate(int i) { return(i.ToString()); }).ToArray()
}
};
var chartModel = new ChartJsViewModel
{
Chart = chart,
ChartJson = JsonConvert.SerializeObject(chart, new JsonSerializerSettings
{
NullValueHandling = NullValueHandling.Ignore
})
};
return(View(chartModel));
}
// [ServiceFilter(typeof(KlantFilter))]
// [Authorize]
public IViewComponentResult Invoke()
{
// Ref: https://www.chartjs.org/docs/latest/
Klant klant = (Klant)_klantenRepo.GetByEmail(HttpContext.User.Identity.Name);
string[] dataLabels2 = new string[6];
int[] data = { 0, 0, 0, 0, 0, 0 };
DateTime date = DateTime.Today;
DateTime date2;
for (int i = 5; i >= 0; i--)
{
date2 = date.AddDays(-7);
dataLabels2[i] = string.Format("{0:dd/MM/yy}", date2) + "-" + string.Format("{0:dd/MM/yy}", date);
foreach (Contract c in klant.Contracten)
{
foreach (Ticket t in c.Tickets)
{
if (t.AanmaakDatum <= date)
{
if (t.DatumAfgewerkt.Equals(null) || t.DatumAfgewerkt >= date2)
{
data[i] += 1;
}
}
}
}
date = date2.AddDays(-1);
}
string[] backgroundColor =
{
"rgba(204, 214, 12, 0.2)",
"rgba(204, 214, 12, 0.2)",
"rgba(204, 214, 12, 0.2)",
"rgba(204, 214, 12, 0.2)",
"rgba(204, 214, 12, 0.2)",
"rgba(204, 214, 12, 0.2)"
};
Dataset dataset = new Dataset {
label = "Actieve tickets", data = data, borderWidth = 1, backgroundColor = backgroundColor
};
Dataset[] datasets = { dataset };
ChartJs Chart = new ChartJs
{
type = "line",
responsive = true,
data = new Models.Chart.Data
{
labels = dataLabels2,
datasets = datasets
},
};
var chartModel = new ChartJsViewModel
{
Chart = Chart,
ChartJson = JsonConvert.SerializeObject(Chart, new JsonSerializerSettings
{
NullValueHandling = NullValueHandling.Ignore,
})
};
return(View(chartModel));
}
public IViewComponentResult Invoke()
{
// var chart = JsonConvert.DeserializeObject<ChartJs> (chartData);
Ticks ticks = new Ticks {
beginAtZero = true
};
Yax yax = new Yax {
ticks = ticks
};
Yax[] y = new Yax[1];
y[0] = yax;
Scales scales = new Scales();
scales.yAxes = y;
Data data = new Data();
StaffSale saleData = GetStaffSaleData();
Dataset datasetY = new Dataset
{
borderWidth = 1,
label = "Yearly",
data = saleData.YearWise.ToArray(),
backgroundColor = new string[] {
"rgba(255, 99, 132, 0.2)",
"rgba(54, 162, 235, 0.2)",
"rgba(255, 206, 86, 0.2)",
"rgba(75, 192, 192, 0.2)",
"rgba(153, 102, 255, 0.2)",
"rgba(54, 162, 235, 0.2)",
"rgba(255, 203, 83, 0.2)",
"rgba(255, 159, 64, 0.2)",
//"rgba(255, 99, 132, 0.2)",
//"rgba(54, 162, 235, 0.2)",
//"rgba(255, 206, 86, 0.2)",
//"rgba(75, 192, 192, 0.2)",
},
borderColor = new string[] {
"rgba(255, 99, 132, 1)",
"rgba(54, 162, 235, 1)",
"rgba(255, 206, 86, 1)",
"rgba(75, 192, 192, 1)",
"rgba(153, 102, 255, 1)",
"rgba(255, 203, 83, 1)",
"rgba(255, 159, 64, 1)",
"rgba(255, 99, 132, 1)",
//"rgba(54, 162, 235, 1)",
//"rgba(255, 206, 86, 1)",
//"rgba(75, 192, 192, 1)",
//"rgba(153, 102, 255, 1)",
}
};
Dataset datasetM = new Dataset
{
borderWidth = 1,
label = "Monthly",
data = saleData.MonthWise.ToArray(),
backgroundColor = new string[] {
// "rgba(255, 99, 132, 0.2)",
// "rgba(54, 162, 235, 0.2)",
// "rgba(255, 206, 86, 0.2)",
"rgba(75, 192, 192, 0.2)",
"rgba(153, 102, 255, 0.2)",
"rgba(54, 162, 235, 0.2)",
"rgba(255, 203, 83, 0.2)",
// "rgba(255, 159, 64, 0.2)",
// "rgba(255, 99, 132, 0.2)",
"rgba(54, 162, 235, 0.2)",
"rgba(255, 206, 86, 0.2)",
//"rgba(75, 192, 192, 0.2)",
},
borderColor = new string[] {
// "rgba(255, 99, 132, 1)",
// "rgba(54, 162, 235, 1)",
// "rgba(255, 206, 86, 1)",
"rgba(75, 192, 192, 1)",
"rgba(153, 102, 255, 1)",
"rgba(255, 203, 83, 1)",
"rgba(255, 159, 64, 1)",
//"rgba(255, 99, 132, 1)",
// "rgba(54, 162, 235, 1)",
"rgba(255, 206, 86, 1)",
"rgba(75, 192, 192, 1)",
// "rgba(153, 102, 255, 1)",
}
};
Dataset datasetC = new Dataset
{
borderWidth = 1,
label = "Today",
data = saleData.CurrentWise.ToArray(),
backgroundColor = new string[] {
"rgba(255, 99, 132, 0.2)",
"rgba(54, 162, 235, 0.2)",
// "rgba(255, 206, 86, 0.2)",
// "rgba(75, 192, 192, 0.2)",
// "rgba(153, 102, 255, 0.2)",
// "rgba(54, 162, 235, 0.2)",
"rgba(255, 203, 83, 0.2)",
"rgba(255, 159, 64, 0.2)",
"rgba(255, 99, 132, 0.2)",
// "rgba(54, 162, 235, 0.2)",
//"rgba(255, 206, 86, 0.2)",
// "rgba(75, 192, 192, 0.2)",
},
borderColor = new string[] {
"rgba(255, 99, 132, 1)",
"rgba(54, 162, 235, 1)",
//"rgba(255, 206, 86, 1)",
//"rgba(75, 192, 192, 1)",
//"rgba(153, 102, 255, 1)",
//"rgba(255, 203, 83, 1)",
//"rgba(255, 159, 64, 1)",
"rgba(255, 99, 132, 1)",
"rgba(54, 162, 235, 1)",
"rgba(255, 206, 86, 1)",
//"rgba(75, 192, 192, 1)",
//"rgba(153, 102, 255, 1)",
}
};
ChartJs chart = new ChartJs
{
type = "bar",
responsive = true,
options = new Options {
scales = scales, title = new Title {
Display = true, Text = "Staff Sale"
}, legend = new Legend {
Position = "Top"
}
},
data = new Data {
datasets = new Dataset[] { datasetY, datasetM, datasetC }, labels = saleData.StaffName.ToArray()
}
};
var chartModel = new ChartJsViewModel
{
Chart = chart,
ChartJson = JsonConvert.SerializeObject(chart, new JsonSerializerSettings
{
NullValueHandling = NullValueHandling.Ignore
})
};
return(View(chartModel));
}
public async Task <IActionResult> Details(string?id)
{
if (id == null)
{
return(NotFound());
}
var product = await _context.Product.Include(x => x.IdCategoriaNavigation).Include(x => x.IdPrecoNavigation).Include(x => x.IdPrecoNavigation.PrecoVariacoes)
.FirstOrDefaultAsync(m => m.Id == id);
if (product == null)
{
return(NotFound());
}
ChartJsViewModel chartJS = new ChartJsViewModel();
ChartJS chart = new ChartJS();
Data data = new Data();
chartJS.Product = product;
// Queremos um gráfico linear
int i = 2;
List <Datum> dataList = new List <Datum>();
foreach (var item in product.IdPrecoNavigation.PrecoVariacoes)
{
// Queremos as datas assim com as mudanças de preço
dataList.Add(new Datum {
x = item.DataAlteracao.ToString("MM/dd/yyyy"), y = item.Preco
});
i++;
}
// Ordenar a lista de acordo com a data
//dataList = dataList.OrderBy(o => o.t).ToList();
Datum[] dataListArray = dataList.ToArray();
data.datasets = new Dataset[] {
new Dataset
{
label = product.Nome,
data = dataListArray,
backgroundColor = new string[] { "rgba(255,195,160, .5)" },
borderColor = new string[] { "rgba(253,165,92, .7)" },
borderWidth = 2,
}
};
//chart.data.datasets.;
// data.datasets = new Dataset[] { dataset
//};
// {
//label = product.Nome,
//data = dataArray,
//backgroundColor = new string[] { "rgba(105, 0, 132, .2)" },
//borderColor = new string[] { "rgba(200, 99, 132, .7)" },
//borderWidth = 2
// }
//};
chart.type = "line";
chart.options = new Options
{
responsive = true,
scales = new Scales
{
xAxes = new Xax[]
{
new Xax
{
type = "time",
time = new Time {
unit = "day", unitStepSize = 1, displayFormats = new DisplayFormats {
day = "MMM DD"
}
}
}
}
},
};
chart.data = data;
chartJS.Chart = chart;
return(View(chartJS));
}
public IViewComponentResult Invoke()
{
double[] chartdt = new double[9];
try
{
SqlConnectionStringBuilder builder = new SqlConnectionStringBuilder();
builder.DataSource = "loanstarpoc.database.windows.net";
builder.UserID = "alvianda";
builder.Password = "******";
builder.InitialCatalog = "StudentDW";
using (SqlConnection connection = new SqlConnection(builder.ConnectionString))
{
string sql = "select title as courseTitle,count(PersonID) as studentCount, avg(grade) as avgGrade ";
sql += "from allcourses.info ";
sql += "GROUP BY title; ";
using (SqlCommand command = new SqlCommand(sql, connection))
{
connection.Open();
using (SqlDataReader reader = command.ExecuteReader())
{
var i = 0;
while (reader.Read())
{
Console.WriteLine("{0}...{1}...{2}", reader.GetString(0), reader.GetInt32(1), Math.Round(reader.GetDouble(2), 2));
chartdt[i] = (double)reader.GetInt32(1);
i++;
}
}
}
}
}
catch (SqlException e)
{
Console.WriteLine(e.ToString());
}
// Ref: https://www.chartjs.org/docs/latest/
var chartvals = $"[{string.Join(',', chartdt)}]";
//var chartvals = "[2,3,4,5,6,7]";
var chartData = @"
{
type: 'bar',
responsive: true,
data:
{
labels: ['Calculus', 'Chemistry', 'Physics', 'Composition', 'Poetry', 'Literature', 'Microeconomics', 'Macroeconomics', 'Quantitative'],
datasets: [{
data: " + chartvals + @",
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)',
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)',
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)'
],
borderWidth: 1
}]
},
options:
{
scales:
{
yAxes: [{
ticks:
{
beginAtZero: true
}
}]
}
}
}";
var chart = JsonConvert.DeserializeObject <ChartJs>(chartData);
var t = new Title
{
text = "Course Student Attendance",
display = true
};
chart.title = t;
var chartModel = new ChartJsViewModel
{
Chart = chart,
ChartJson = JsonConvert.SerializeObject(chart, new JsonSerializerSettings
{
NullValueHandling = NullValueHandling.Ignore,
})
};
return(View(chartModel));
}
