Y
Yusuf Ahmet Uzundeveli
Guest
Hi,
I'm developing web application at ASP .Net Core 2.2. I have to stop at an issue because of being new in .Net Core.
ASP In the .Net Core, I have two int arrays in backend.
I want to show them through various graphs such as curved line and bar chart, but I couldn't evaluate them in the script structure while I could use the variables I took from class via @model.
Sample:
ChartJs Charts:
<canvas id="myChart" width="400" height="400"></canvas>
<script>
var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
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
}
}]
}
}
});
</script>
Google Charts:
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses'],
['2004', 1000, 400],
['2005', 1170, 460],
['2006', 660, 1120],
['2007', 1030, 540]
]);
var options = {
title: 'Company Performance',
curveType: 'function',
legend: { position: 'bottom' }
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>
As you can see in the two code blocks I have illustrated above, the data was entered into the code blocks. At this point, I want to manipulate the data through a set of data, instead of entering the data manually.
How do I pass the int arrays below into these code blocks? The elements of these int arrays will be obtained as a result of the calculation and how can I extract a curve from arrays in both Chart types?
//My Arrays I want to use each integers.
//x axis
int[] x_ekseni_olculen_yillar = { 1997, 2003, 2005, 2009, 2014, 2018, 2019 };
//y axis
int[] y_ekseni_ofke_katsayisi = { 1, 3, 5, 3, 1, 18, 9 };
Continue reading...
I'm developing web application at ASP .Net Core 2.2. I have to stop at an issue because of being new in .Net Core.
ASP In the .Net Core, I have two int arrays in backend.
I want to show them through various graphs such as curved line and bar chart, but I couldn't evaluate them in the script structure while I could use the variables I took from class via @model.
Sample:
ChartJs Charts:
<canvas id="myChart" width="400" height="400"></canvas>
<script>
var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
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
}
}]
}
}
});
</script>
Google Charts:
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses'],
['2004', 1000, 400],
['2005', 1170, 460],
['2006', 660, 1120],
['2007', 1030, 540]
]);
var options = {
title: 'Company Performance',
curveType: 'function',
legend: { position: 'bottom' }
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>
As you can see in the two code blocks I have illustrated above, the data was entered into the code blocks. At this point, I want to manipulate the data through a set of data, instead of entering the data manually.
How do I pass the int arrays below into these code blocks? The elements of these int arrays will be obtained as a result of the calculation and how can I extract a curve from arrays in both Chart types?
//My Arrays I want to use each integers.
//x axis
int[] x_ekseni_olculen_yillar = { 1997, 2003, 2005, 2009, 2014, 2018, 2019 };
//y axis
int[] y_ekseni_ofke_katsayisi = { 1, 3, 5, 3, 1, 18, 9 };
Continue reading...
