Рисование гистограммы с использованием данных MySQL с использованием переполнения стека
Я использую PHP в качестве языка сценариев для серверной части моего веб-приложения
<?php
//importing db.php in the includes folder
require("includes/db.php");
$nic = $_POST["NIC"];
$dp = $_POST["DP"];
$date = $_POST["Date"];
$tele = $_POST["Tele"];
$mail = $_POST["Email"];
$sql="INSERT INTO `order` (NIC,DP,Address,Date,Telephone,Email) VALUES ('$nic ','$dp','$address',CURDATE(),'$tele','$mail')";
$result = mysqli_query($db,$sql);
?>
Приведенный выше код включает в себя отправку формы клиентами, когда они размещают заказ. Я хочу нарисовать гистограмму, используя количество заказов для оси Y и дату для оси X. Как мне этого добиться?
Решение
Я не могу помочь вам дать коды. Но я могу помочь вам сказать, что вы можете использовать «Google Chart» для этого. Вам нужно какое-то учебное пособие, но если вы знаете js, php будет легко выучить.
Но если вы не хотите использовать какой-либо плагин или что-то такое, что будет сложно, я думаю ..
Просто сделайте снимок в Google Chart и решите. Ищите его в Google. Спасибо
Другие решения
Google Charts
https://developers.google.com/chart/
Пример кода, настроенный для вашего использования:
<html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
// Load the Visualization API and the corechart package.
google.charts.load('current', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback(drawChart);
// Callback that creates and populates a data table,
// instantiates the bar chart, passes in the data and
// draws it.
function drawChart() {
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Date');
data.addColumn('number', '# of Orders');
// This is where you will need to pass your SQL data to JavaScript
// I have not included this information, if needed, ask
data.addRows([
['01/02/17',1],
['01/03/17',4],
['01/04/17',9],
['01/05/17',6]
]);
// Set chart options
var options = {
'title':'Orders over Time',
'width':500,
'height':500};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<!--Div that will hold the pie chart-->
<div id="chart_div"></div>
</body>
</html>
JS Fiddle Proof:
https://jsfiddle.net/g77pnex5/
detector