<script>

const SPL_peak_title = '<?php echo( "  dBA      |  niveau sonore crête  |  site : " . $p_aqcm_SITE_ID . "  |  " . $time_start_string . "  |" ); ?>' ;

var ctx_SPL_peak = document.getElementById('Chart_SPL_peak').getContext("2d");

chart_SPL_peak = new Chart(ctx_SPL_peak, {
	
	type: 'line',
  
	data: { 
		datasets: [ 
			<?php echo $data_SPL_peak; ?> 
		]
	},
	options: {
		
		animation: false,
		
		scales: {
			
			x: {
				
				type: 'time',
				
				min: <?php echo 1000*$start;?>,
				max: <?php echo 1000*$stop;?>,
				
				time: {
					unit: '<?php echo $time_unit; ?>',
					displayFormats: {
						minute : 'HH:mm',
						hour: 'HH:mm',
						hours: 'dd/MM  HH:mm',
						day:  'dd/MM  HH:mm'
					},
					tooltipFormat: 'DD T'
				},
				
				
				ticks: {
					
					stepSize: <?php echo $x_stepSize; ?>,
					color: TICKS_color,
					autoSkip: false,
					font: {
						size: TICKS_font_size_x,
						weight: 'normal', 
						family: 'Arial',  
						style: 'normal'  
					}
				},
				grid:{
					color: color_of_grids
				},
		
			},
			
			y: {
				
				min: <?php echo($FS_MIN_SPL_peak); ?>,
				max: <?php echo($FS_MAX_SPL_peak); ?>,
				position: 'left',
				ticks: {
					padding: OPTIONS_SCALES_Y_padding_array[OPTIONS_SCALES_Y_padding_index_SPL_peak],
					color: TICKS_color,
					labelOffset: 0,
					autoSkip: true,
					font: {
						size: TICKS_font_size_y,
						weight: 'normal', 
						family: 'Arial',  
						style: 'normal'  
					}
				},
				grid:{
					color: color_of_grids
				},
				
			}
			
		},
		
		plugins: {
			
			legend: {
				position: 'right',
				labels: {
					boxWidth: LEGEND_box_width,
					boxHeight: LEGEND_box_height,
					color: LEGEND_box_color
				}
			},
		  
			title: {
				color: '#000000ff',
				display: true,    
				text: SPL_peak_title, 
				position: 'top',   
				align: 'start',   
				fullSize: true,    
				font: {
					size: 20,       
					weight: 'normal', 
					family: 'Arial',  
					style: 'normal'  
				},
				padding: {
					top: 8,         
					bottom: 13,      
				}
			},
		  
			annotation: {
				annotations: {
					line0: {
						type: 'box',
						yMin: <?php echo $aqcm_SPL_TRIG_0; ?> - trig_line_SPL_peak,
						yMax: <?php echo $aqcm_SPL_TRIG_0; ?> + trig_line_SPL_peak,
						backgroundColor: TRIG_color_0,
						borderColor: TRIG_backgroundColor,
						borderWidth: 1,
						display: trigger_display
					},
					line1: {
						type: 'box',
						yMin: <?php echo $aqcm_SPL_TRIG_1; ?>-trig_line_SPL_peak,
						yMax: <?php echo $aqcm_SPL_TRIG_1; ?>+trig_line_SPL_peak,
						backgroundColor: TRIG_color_1,
						borderColor: TRIG_backgroundColor,
						borderWidth: 1,
						display: trigger_display
					},
					line2: {
						type: 'box',
						yMin: <?php echo $aqcm_SPL_TRIG_2; ?>-trig_line_SPL_peak,
						yMax: <?php echo $aqcm_SPL_TRIG_2; ?>+trig_line_SPL_peak,
						backgroundColor: TRIG_color_2,
						borderColor: TRIG_backgroundColor,
						borderWidth: 1,
						display: trigger_display
					},
					line3: {
						type: 'box',
						yMin: <?php echo $aqcm_SPL_TRIG_3; ?>-trig_line_SPL_peak,
						yMax: <?php echo $aqcm_SPL_TRIG_3; ?>+trig_line_SPL_peak,
						backgroundColor: TRIG_color_3,
						borderColor: TRIG_backgroundColor,
						borderWidth: 1,
						display: trigger_display
					},
					line4: {
						type: 'box',
						yMin: <?php echo $aqcm_SPL_TRIG_4; ?>-trig_line_SPL_peak,
						yMax: <?php echo $aqcm_SPL_TRIG_4; ?>+trig_line_SPL_peak,
						backgroundColor: TRIG_color_4,
						borderColor: TRIG_backgroundColor,
						borderWidth: 1,
						display: trigger_display
					},
					line5: {
						type: 'box',
						yMin: <?php echo $aqcm_SPL_TRIG_5; ?>-trig_line_SPL_peak,
						yMax: <?php echo $aqcm_SPL_TRIG_5; ?>+trig_line_SPL_peak,
						backgroundColor: TRIG_color_5,
						borderColor: TRIG_backgroundColor,
						borderWidth: 1,
						display: trigger_display
					}
					
				}

			},
		
			tooltip: {
				enabled: tooltip_enabled
			}

		}
		
	}
  
});

</script>

