1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89
| <script type="text/javascript">
$.ajax ({
url:"{{ route('admin.chart') }}",
method:"GET",
success:function(data)
{
var label = data.result.label;// maka donner any anaty tableau
var donnee = data.result.data;
var cat = data.result.cat;
console.log(data);
console.log(label);
// Get context with jQuery - using jQuery's .get() method.
//--------
//PIE CHART
//---------
var pieChartCanvas = $('#pieChart').get(0).getContext('2d')
var pieChart = new Chart(pieChartCanvas)
var PieData = [
{
value : dataa,
color : '#f56954',
highlight: '#f56954',
label : 'lita'
},
{
value : 500,
color : '#00a65a',
highlight: '#00a65a',
label : 'IE'
},
{
value : 400,
color : '#f39c12',
highlight: '#f39c12',
label : 'FireFox'
},
{
value : 600,
color : '#00c0ef',
highlight: '#00c0ef',
label : 'Safari'
},
{
value : 300,
color : '#3c8dbc',
highlight: '#3c8dbc',
label : 'Opera'
},
{
value : 100,
color : '#d2d6de',
highlight: '#d2d6de',
label : 'Navigator'
}
]
var pieOptions = {
//Boolean - Whether we should show a stroke on each segment
segmentShowStroke : true,
//String - The colour of each segment stroke
segmentStrokeColor : '#fff',
//Number - The width of each segment stroke
segmentStrokeWidth : 2,
//Number - The percentage of the chart that we cut out of the middle
percentageInnerCutout: 50, // This is 0 for Pie charts
//Number - Amount of animation steps
animationSteps : 100,
//String - Animation easing effect
animationEasing : 'easeOutBounce',
//Boolean - Whether we animate the rotation of the Doughnut
animateRotate : true,
//Boolean - Whether we animate scaling the Doughnut from the centre
animateScale : false,
//Boolean - whether to make the chart responsive to window resizing
responsive : true,
// Boolean - whether to maintain the starting aspect ratio or not when responsive, if set to false, will take up entire container
maintainAspectRatio : true,
//String - A legend template
legendTemplate : '<ul class="<%=name.toLowerCase()%>-legend"><% for (var i=0; i<segments.length; i++){%><li><span style="background-color:<%=segments[i].fillColor%>"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>'
}
//Create pie or douhnut chart
// You can switch between pie and douhnut using the method below.
pieChart.Doughnut(PieData, pieOptions)
}
});
</script> |
Partager