%PDF-
%PDF-
Mini Shell
Mini Shell
<!doctype html>
<html>
<head>
<title>Bar Chart</title>
<script src="https:cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<style>
canvas {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
</style>
</head>
<body>
<input type="button" id="btnBuscar" value="Graficar">
<canvas id="myChart" width="400" height="150"></canvas>
<canvas id="monthwise" width="400" height="150"></canvas>
<canvas id="pie" width="400" height="150"></canvas>
<script type="text/javascript">
var paramNombres = [];
var paramEdades = [];
$.post("<?php echo base_url();?>chart/totalno",
function(data){
var obj = JSON.parse(data);
paramNombres = [];
paramEdades = [];
$.each(obj, function(i,item){
paramNombres.push(item.name);
paramEdades.push(item.total);
});
var ctx = $("#myChart");
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: paramNombres,
datasets: [
{
label: "Leads Generated",
fill: true,
lineTension: 0.1,
backgroundColor: [
'rgba(255, 99, 132)',
'rgba(54, 162, 235)',
'rgba(255, 206, 86)',
'rgba(75, 192, 192)',
'rgba(153, 102, 255)',
'rgba(255, 159, 64)'
],
borderColor: "rgba(75,192,192,1)",
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
pointBorderColor: "rgba(75,192,192,1)",
pointBackgroundColor: "#fff",
pointBorderWidth: 10,
pointHoverRadius: 5,
pointHoverBackgroundColor: "rgba(75,192,192,1)",
pointHoverBorderColor: "rgba(220,220,220,1)",
pointHoverBorderWidth: 5,
pointRadius: 1,
pointHitRadius: 10,
data: paramEdades,
spanGaps: false,
}
]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
});
</script>
<script type="text/javascript">
var paramNombres = [];
var paramEdades = [];
$.post("<?php echo base_url();?>chart/enquirytotal",
function(data){
var obj = JSON.parse(data);
//console.log(data);
paramNombres = [];
paramEdades = [];
$.each(obj, function(i,item){
paramNombres.push(item.source);
paramEdades.push(item.total);
});
var ctx = $("#pie");
var myChart = new Chart(ctx, {
type: 'pie',
data: {
labels: paramNombres,
datasets: [
{
label: "Leads Generated",
fill: true,
lineTension: 0.1,
backgroundColor: [
'rgba(255, 99, 132)',
'rgba(54, 162, 235)',
'rgba(255, 206, 86)',
'rgba(75, 192, 192)',
'rgba(153, 102, 255)',
'rgba(255, 159, 64)'
],
borderColor: "rgba(75,192,192,1)",
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
pointBorderColor: "rgba(75,192,192,1)",
pointBackgroundColor: "#fff",
pointBorderWidth: 10,
pointHoverRadius: 5,
pointHoverBackgroundColor: "rgba(75,192,192,1)",
pointHoverBorderColor: "rgba(220,220,220,1)",
pointHoverBorderWidth: 5,
pointRadius: 1,
pointHitRadius: 10,
data: paramEdades,
spanGaps: false,
}
]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
});
</script>
<script type="text/javascript">
var paramNombres = [];
var paramEdades = [];
$.post("<?php echo base_url();?>chart/closedno",
function(data){
var obj = JSON.parse(data);
paramNombres = [];
paramEdades = [];
$.each(obj, function(i,item){
paramNombres.push(item.name);
paramEdades.push(item.total);
});
var ctx = $("#monthwise");
var myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: paramNombres,
datasets: [
{
label: "Leads Generated",
fill: true,
lineTension: 0.1,
backgroundColor: [
'rgba(255, 99, 132)',
'rgba(54, 162, 235)',
'rgba(255, 206, 86)',
'rgba(75, 192, 192)',
'rgba(153, 102, 255)',
'rgba(255, 159, 64)'
],
borderColor: "rgba(75,192,192,1)",
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
pointBorderColor: "rgba(75,192,192,1)",
pointBackgroundColor: "#fff",
pointBorderWidth: 10,
pointHoverRadius: 5,
pointHoverBackgroundColor: "rgba(75,192,192,1)",
pointHoverBorderColor: "rgba(220,220,220,1)",
pointHoverBorderWidth: 5,
pointRadius: 1,
pointHitRadius: 10,
data: paramEdades,
spanGaps: false,
}
]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero:true
}
}]
}
}
});
});
</script>
</body>
</html>
Zerion Mini Shell 1.0