<script>

	var	PM25_valeur	= <?php echo($AQCM05_PM25); ?>;
	var	PM25_color	= '<?php echo($AQCM05_PM25_color); ?>';
	var	PM25_mini 	= <?php echo($PM25_mini); ?>;
	var	PM25_maxi 	= <?php echo($PM25_maxi); ?>;
 
	var PM25_config = {
		
		type: 'doughnut',
		
		data: {
			datasets: [{
				data: [ PM25_valeur - PM25_mini, PM25_maxi - PM25_valeur ],
				backgroundColor: [PM25_color, gauges_inactive_ring_color],
				borderColor: '#000000',
				borderWidth: gauges_line_width
			}]
		},
		
		options: {
			
			radius: gauges_radius,
			cutout: gauges_cutout,
			layout: {
				padding: {
					left: 6,
					right: 6
				}
			},			
			responsive: true,
			maintainAspectRatio: false,
			rotation: -90,
			circumference: 180,
			
			animation: {
				animateRotate: false,
				animateScale: false
			},
			
			watermark: {
				image: image_PM25,
				x: emoticon_x,
				y: emoticon_y,
				width: emoticon_width,
				height: emoticon_height,
				opacity: 1,
				alignX: "right",
				alignY: "top",
				alignToChartArea: false,
				position: "back",
			},
			
			plugins: {

				tooltip: {
					enabled: false
				},
				
				annotation: {
					annotations: {
						labelMin: {
							content: [PM25_mini],
							type: 'label',
							xValue: 0,
							xAdjust: mini_x_adjust,
							yValue: 0,
							yAdjust: mini_y_adjust,
							color: gauges_text_color,
							backgroundColor: gauges_background_color,
							font: [{size: mini_maxi_font_size, weight: 'normal'}, {family: 'Arial'}],
						},
						labelMax: {
							content: [PM25_maxi],
							type: 'label',
							xValue: 0,
							xAdjust: maxi_x_adjust,
							yValue: 0,
							yAdjust: maxi_y_adjust,
							color: gauges_text_color,
							backgroundColor: gauges_background_color,
							font: [{size: mini_maxi_font_size, weight: 'normal'}, {family: 'Arial'}],
						},
						labelValue: {
							content: [PM25_valeur],
							type: 'label',
							textlign: 'center',
							xValue: 0,
							xAdjust: value_x_adjust,
							yValue: 0,
							yAdjust: value_y_adjust,
							color: gauges_text_color,
							backgroundColor: gauges_background_color,
							font: [{size: value_font_size, weight: 'normal'}, {family: 'Arial'}],
						},
						labelTitle: {
							content: ['PM2.5'],
							type: 'label',
							xValue: 0,
							xAdjust: title_x_adjust,
							yValue: 0,
							yAdjust: title_y_adjust,
							color: gauges_text_color,
							backgroundColor: gauges_background_color,
							font: [{size: title_font_size, weight: 'normal'}, {family: 'Arial'}],
						},
						labelUnit: {
							content: ['μg/m3'],
							type: 'label',
							xValue: 0,
							xAdjust: unit_x_adjust,
							yValue: 0,
							yAdjust: unit_y_adjust,
							color: gauges_text_color,
							backgroundColor: gauges_background_color,
							font: [{size: unit_font_size, weight: 'normal'}, {family: 'Arial'}],
						},
					}
				}



				
			}

		}
		

		
	};

	var PM25_chartCtx = document.getElementById('gauge_PM25').getContext('2d');
	var gauge_PM25 = new Chart(PM25_chartCtx, PM25_config);
		
</script>
