codeigniter_test2/dsa.php

80 lines
2.4 KiB
PHP
Raw Permalink Normal View History

2020-01-02 23:07:40 +07:00
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript">
google.load('visualization', '1.0', {'packages''controls']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawDashboard);
function drawVisualization() {
// Prepare the data
var data = google.visualization.arrayToDataTable([
['Name', 'Age'],
['Michael' , 12],
['Elisa', 20],
['Robert', 7],
['John', 54],
['Jessica', 22],
['Aaron', 3],
['Margareth', 42],
['Miranda', 33]
]);
// Define a NumberRangeFilter slider control for the 'Age' column.
var slider = new google.visualization.ControlWrapper({
'controlType': 'NumberRangeFilter',
'containerId': 'control_div',
'options': {
'filterColumnLabel': 'Age',
'minValue': 0,
'maxValue': 60
}
});
// Define a bar chart
var barChart = new google.visualization.ChartWrapper({
'chartType': 'BarChart',
'containerId': 'chart_div',
'options': {
'width': 400,
'height': 300,
'hAxis': {'minValue': 0, 'maxValue': 60},
'chartArea': {top: 0, right: 0, bottom: 0}
}
});
// Create the dashboard.
var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard_div')).
// Configure the slider to affect the bar chart
bind(slider, barChart).
// Draw the dashboard
draw(data);
}
/*google.load('visualization', '1', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
function drawChart() {
var jsonData = {"cols":[{"id":"brand","label":"brand","type":"string"},{"id":"size","label":"size","type":"number"},{"id":"qty","label":"qty","type":"number"}],"rows":[{"c":[{"v":"Bridgestone"},{"v":999},{"v":878}]},{"c":[{"v":"TOYO"},{"v":789},{"v":987}]},{"c":[{"v":"CUBEX"},{"v":876},{"v":777}]}]}
var data = new google.visualization.DataTable(jsonData);
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, {width: 400, height: 240});
}*/
</script>
</head>
<body>
<div id="dashboard_div">
<div id="chart_div"></div>
<div id="control_div"></div>
</div>
</body>
</html>