CoreChartView/Chart Core Mvc.txt
Gönderilme zamanı: 04 May 2021 16:52
Kod: Tümünü seç
@{
ViewData["Title"] = "Index4";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<!DOCTYPE html>
<html lang="en">
<head>
<title>Result Visualization</title>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function () {
$.ajax({
type: "POST",
dataType: "json",
contentType: "application/json",
url: '@Url.Action("VisualizeUrunResult", "Chart")',
success: function (result) {
google.charts.load('current', {
'packages': ['corechart']
});
google.charts.setOnLoadCallback(function () {
drawChart(result);
});
}
});
});
function drawChart(result) {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Name');
data.addColumn('number', 'Stoklar');
var dataArray = [];
$.each(result, function (i, obj) {
dataArray.push([obj.ad, obj.sayi]);
});
data.addRows(dataArray);
var columnChartOptions = {
title: "Ürün - Stok Grafiği",
width: 1000,
height: 400,
bar: { groupWidth: "20%" },
};
var columnChart = new google.visualization.PieChart(document
.getElementById('Piechart_div'));
columnChart.draw(data, columnChartOptions);
}
</script>
</head>
<body>
<div id="Piechart_div"></div>
</body>
</html>