Page History

Some of the plots routinely displayed on this page have been temporarily removed, upon finding them to have been affected by a computational error in our processing chain. The affected diagnostics are the maps of correlation for the 3-month aggregations, for all the variables. 

Once corrected versions of these diagnostics are computed, an announcement will be posted on these pages and the revised plots will be uploaded to the webpage. In the meantime users can reproduce these plots by following the workflow described in the C3S Jupyter Notebook tutorial on seasonal forecasts verification (https://ecmwf-projects.github.io/copernicus-training-c3s/sf-verification.html)

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" integrity="sha512-aVKKRRi/Q/YV+4mjoKBsE4x3H+BkegoM/em46NNlCqNTmUYADjBbeNefNxYV7giUp0VxICtqdrbqU7iVaeZNXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>      


   <style>
        option:disabled { opacity: 0.4; }
    </style>

  <script>
		$(document).ready(function(){

      var plotsBaseURL='https://sites.ecmwf.int/cxep/c3s-seasonal-verification/'

      var origins = [{key:'ecmwf.s51',label:'ECMWF SEAS5 (C3Sv5.1) (system=51)'},{key:'meteo_france.s8',label:'MeteoFrance System8 (system=8)'},{key:'ukmo.s601',label:'UK MetOffice GloSea6 (system=601)'}, {key:'ukmo.s602',label:'UK MetOffice GloSea6 (system=602)'}, {key:'ukmo.s603',label:'UK MetOffice GloSea6 (system=603)'}, {key:'cmcc.s35',label:'CMCC SPSv3.5 (system=35)'}, {key:'dwd.s21',label:'DWD GCFS2.1 (system=21)'}, {key:'ncep.s2',label:'NCEP CFSv2 (system=2)'}, {key:'jma.s3',label:'JMA CPS3 (system=3)'}, {key:'eccc.s2',label:'ECCC CanCM4 (system=2)'}, {key:'eccc.s3',label:'ECCC GEM5-NEMO (system=3)'}, {key:'eccc.s4',label:'ECCC CanESM5.1p1bc (system=4)'}, {key:'eccc.s5',label:'ECCC GEM5.2-NEMO (system=5)'}, {key:'C3Smm.s2022',label:'C3S multi-system (2022)'}, {key:'C3Smm.s2023',label:'C3S multi-system (2023)'}, {key:'C3Smm.s2024',label:'C3S multi-system (2024)'}];
    //   var startDates = [{key:'10',label:'October'}, {key:'11',label:'November'},{key:'12',label:'December'},];
      var variableNames = [{key:'msl',label:'Mean sea-level pressure'}, {key:'tp',label:'Total precipitation'}, {key:'t2m',label:'2-metre temperature'}, {key:'sst',label:'Sea-surface temperature'}, {key:'sstind',label:'SST indices'}];
      var scores =[{key:'corr',label:'Correlation'}, {key:'rps',label:'RPS'}, {key:'roc',label:'ROC'}];
      var leadtimes =[{key:'1m.fcmonth1',label:'1m; lead0'},{key:'1m.fcmonth2',label:'1m; lead1'}, {key:'1m.fcmonth3',label:'1m; lead2'},{key:'1m.fcmonth4',label:'1m; lead3'},{key:'1m.fcmonth5',label:'1m; lead4'},{key:'1m.fcmonth6',label:'1m; lead5'},{key:'3m.fcmonth3',label:'3m; lead0'},{key:'3m.fcmonth4',label:'3m; lead1'},{key:'3m.fcmonth5',label:'3m; lead2'},{key:'3m.fcmonth6',label:'3m; lead3'} ];
      var categories = [{key:'0', label:'Below lower tercile'}, {key:'1', label:'Normal'}, {key:'2', label:'Above upper tercile'}]
	  var sstindices = [{key:'NINO12', label:'NINO 1+2'}, {key:'NINO3', label:'NINO 3'}, {key:'NINO34', label:'NINO 3.4'}, {key:'NINO4', label:'NINO 4'}, {key:'IOD', label:'IOD'}, {key:'IND1', label:'IndOcW'}, {key:'IND2', label:'IndOcE'}]

      var scores_by_cat = ['roc'];

        // populate selects
        var populate = function(vals,id,available){
            $.each(vals, function(){
                $('<option/>', {'value': this.key,'text': this.label}).appendTo('#'+id);
            });
        }
        populate(origins,'sel_origin');
        // populate(startDates,'sel_stdate');
        populate(variableNames,'sel_varn');
        populate(scores,'sel_score');
        populate(leadtimes,'sel_leadt');
        populate(categories,'sel_cat');
		populate(sstindices,'sel_ind');

      // populate start dates
      function getMonthName(monthNumber) {
      const date = new Date(2001, monthNumber - 1, 1);
      //date.setMonth(monthNumber - 1);
      return date.toLocaleString('en-GB', { month: 'long' });
      }

      for (var i = 1; i < 13; i++) {
        //available = [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
        //if (available.includes(i)) {
        //    $('<option />', {'value': i,'text': getMonthName(i) }).appendTo('#sel_stdate');
        //
        //} else {
        //    $('<option />', {'value': i,'text': getMonthName(i), 'disabled':'disabled'}).appendTo('#sel_stdate');
        //}
	 	$('<option />', {'value': i,'text': getMonthName(i) }).appendTo('#sel_stdate');
      }

      //update functions
      var updateImage = function(){
        var origin = $('#sel_origin').val();
        var stdate = $('#sel_stdate').val();
		var str_stdate = String(stdate).padStart(2, '0');
        var varn   = $('#sel_varn').val();
        var score  = $('#sel_score').val();
        var leadt  = $('#sel_leadt').val();
        var cat    = $('#sel_cat').val();
		var sstind = $('#sel_ind').val();

        var imgbasename = origin.replace('.','_')+'_stmonth'+str_stdate+'_hindcast1993-2016_monthly.'+leadt+'.'+varn ;

		if (scores_by_cat.includes(score)) {
          $('#menu_cat').show();
          $('#plot1').attr('src',plotsBaseURL+'/plots/stmonth'+str_stdate+'/'+imgbasename+'.category'+cat+'.'+score+'.png');

        } else {
          $('#menu_cat').hide();
          $('#plot1').attr('src',plotsBaseURL+'/plots/stmonth'+str_stdate+'/'+imgbasename+'.'+score+'.png');
        }


		if(varn=='sstind') {
		  $('#menu_ind').show();
		  $('#plot2').show();
          $('#sel_stdate').prop('disabled', 'disabled');
          $('#sel_leadt').prop('disabled', 'disabled');
          $('#plot1').attr('src',plotsBaseURL+'plots/sstindices/'+origin.replace('.','_')+'_'+sstind+'_'+score+'_startmonth.png');
    	  $('#plot1').attr('width','50%');
          $('#plot2').attr('src',plotsBaseURL+'plots/sstindices/'+origin.replace('.','_')+'_'+sstind+'_'+score+'_validmonth.png');
          $('#plot2').attr('width','50%');

			$("#sel_score option").each(function() {
   			  if (this.value!='corr') {
				 	this.disabled=true;
				}
			});


        } else {
   		   $('#menu_ind').hide();
           $('#sel_stdate').prop('disabled', false);
           $('#sel_leadt').prop('disabled', false); 
           $('#plot1').attr('width','100%');
           $('#plot2').hide();

 			$("#sel_score option").each(function() {
				 	this.disabled=false;
			})
            
			agg=leadt.split(".")[0];
            if (score=='corr' && agg=='3m') {
                $('#plot1').hide();
                $("#empty_warning").html("<br><br><h1>This plot has been temporarily removed</h1>");
            } else {
                $('#plot1').show();
                $("#empty_warning").html("");
            }
 
        }
        
      }

      updateImage();
      $('#selectors select').on('change',function(e){
        updateImage();
      })

    })

    </script>      

	<div id="selectors">
    <label for="sel_origin">Forecast system: </label><select id="sel_origin"></select>
    <br>
    <label for="sel_stdate">Nominal start date: </label><select id="sel_stdate" ></select>
    <label for="sel_leadt">Aggregation and leadtime: </label><select id="sel_leadt"></select>
    <br>
    <label for="sel_varn">Variable: </label><select id="sel_varn"></select>
    <label for="sel_score">Score: </label><select id="sel_score"></select>
    <div id="menu_cat" style="display: inline"><label for="sel_cat">Category: </label><select id="sel_cat"></select></div>
    <div id="menu_ind" style="display: inline"><label for="sel_ind">SST index: </label><select id="sel_ind"></select></div>     <br/>
    </div>
    <div id="empty_warning"></div>
    <img id="plot1" width="100%"/><br/>
	<img id="plot2" width="100%"/><br/>