54 lines
1.7 KiB
HTML
54 lines
1.7 KiB
HTML
|
<!doctype html>
|
||
|
<html>
|
||
|
|
||
|
<head>
|
||
|
<title>Horizontal Bar Chart</title>
|
||
|
<script src="charts/Chart.bundle.js"></script>
|
||
|
<script src="charts/utils.js"></script>
|
||
|
|
||
|
</head>
|
||
|
|
||
|
<body>
|
||
|
<div id="canvas-holder" style="width:100%">
|
||
|
<canvas id="chart-area" />
|
||
|
</div>
|
||
|
<a onclick="javascript: mostrar('bar')">barras</a>
|
||
|
<a onclick="javascript: mostrar('pie')">pie</a>
|
||
|
<a onclick="javascript: mostrar('line')">lines</a>
|
||
|
<a onclick="javascript: mostrar('radar')">radar</a>
|
||
|
<a onclick="javascript: mostrar('polarArea')">area</a>
|
||
|
<a onclick="javascript: mostrar('doughnut')">doughnut</a>
|
||
|
|
||
|
<script>
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
window.onload = mostrar('bar');
|
||
|
|
||
|
function mostrar(tipo) {
|
||
|
var config = {
|
||
|
type:tipo,
|
||
|
data: {
|
||
|
datasets: [{ data: ['1','1','1','1','1','1','1','1','1','2','3','3','10','11','122'] , backgroundColor: ['#52b16b','#84a1f5','#93461a','#243231','#5e15ec','#cf55b2','#a7f9e9','#67640c','#de31ed','#23f325','#17badd','#fb570e','#a0331a','#a70cc2','#1922fc'], label: 'Cantidad ' }], labels: ['oscardanielperez26@gmail.com','migueldesplazamientocentro@gmail.com','obanorte@gmail.com','blasfelipe@gmail.com','alozano.wiam@gmail.com','jalopezga@hotmail.com','steven_395@hotmail.com','juan_cho.10@hotmail.es','kaxtillo@hotmail.com','h4ckypurpl3@gmail.com','fredyrivera@gmail.com','framirezqb@hotmail.com','olgaita11@hotmail.com','kaxtillo@gmail.com','arttesano@gmail.com'] /*
|
||
|
|
||
|
Gracias por compartir, por favor cítanos así:
|
||
|
http://localhost/tupali/a74#/estadisticas
|
||
|
https://tupale.co */
|
||
|
},
|
||
|
options: {
|
||
|
responsive: true
|
||
|
}
|
||
|
};
|
||
|
|
||
|
var ctx = document.getElementById("chart-area").getContext("2d");
|
||
|
|
||
|
window.myPie = new Chart(ctx, config );
|
||
|
}
|
||
|
|
||
|
|
||
|
</script>
|
||
|
</body>
|
||
|
|
||
|
</html>
|