var d0Act=[[0,null],[1,null],[2,null],[3,null],[4,null],[5,null],[6,null],[7,null],[8,null],[9,null],[10,null],[11,null],[12,null],[13,null],[14,null],[15,null],[16,null],[17,null],[18,null],[19,null],[20,null],[21,null],[22,null],[23,null],[24,null],[25,null],[26,null],[27,null],[28,null],[29,null],[30,null],[31,null],[32,null],[33,null],[34,null],[35,null],[36,null],[37,null],[38,null],[39,null],[40,null],[41,null],[42,null],[43,null],[44,null],[45,null],[46,null],[47,null],[48,null],[49,null],[50,null],[51,null],[52,null],[53,null],[54,null],[55,null],[56,null],[57,null],[58,null],[59,null],[60,null],[61,null],[62,null],[63,null],[64,null],[65,null],[66,null],[67,null],[68,null],[69,null],[70,null],[71,null],[72,null],[73,null],[74,null],[75,null],[76,null],[77,null],[78,null],[79,null],[80,null],[81,null],[82,null],[83,null],[84,null],[85,null],[86,null],[87,null],[88,null],[89,null],[90,null],[91,null]];

var limUAct=[[0,1.],[91,1.]];
var limLAct=[[0,-1.],[91,-1.]];
var FechaAct =[[4,"05"],[9,"10"],[14,"15<br> Marzo 2024"],[19,"20"],[24,"25"],[29,"30"],[35,"05"],[40,"10"],[45,"15<br> Abril 2024"],[50,"20"],[55,"25"],[60,"30"],[65,"05"],[70,"10"],[75,"15<br> Mayo 2024"],[80,"20"],[85,"25"],[90,"30"]];
$(function() {
$.plot("#placeSISAct", [
		{
		data: limUAct,
		lines: {  show: true, fill: false, },
		shadowSize: 1,
		color: '#00ff00'
	},
		{
		data: limLAct,
		lines: {  show: true, fill: false, },
		shadowSize: 1,
		color: '#ffff00'
	},
	{
			data: d0Act,		
			lines: {  show: true, fill: false},
			color: '#000000'
		},	
		{
			data: d0Act,
			
			points: { show: true, radius: 2,symbol: 'circle' }  ,
			color: '#000000'
		},
		
		
		
		
		],
		
        {
        xaxis: {
                ticks: FechaAct,
                 font: { 
                        size: 8,   family: 'verdana',style :'normal', color : 'black'
                         },
                     
                    
                },
        yaxis: {
                min:-3,
                max: 3,
                ticks: ['-3','-2','-1','0','1','2','3'],
                font: { 
                        size: 8,   family: 'verdana',style :'normal', color : 'black'
                      }  
               } ,
        grid: {
    			hoverable: true,
    			clickable: true ,
    			autoHighlight: true,  
             }       
        
        }
		
		);
	 
	});
	$('#placeSISAct').bind('plothover', function (event, pos, item) {
        //alert('entre aca');
            if (item) {
                if (previousPoint != item.datapoint) {
                    previousPoint = item.datapoint;

                    $('#tooltip').remove();
                    var x = item.datapoint[0].toFixed(0),
                        y = item.datapoint[1].toFixed(2);
                        sis=d0Act[x];
                        
                        showTooltip(item.pageX, item.pageY,
                                 'sis= '+sis[1]+' std');
                }
            }
            else {
                $('#tooltip').remove();
                previousPoint = null;
            }
        
    });   
    $(function() {
    //  URL para recuperar la estacion 
        var dataurlAct = 'get_json.php?NEst=87097&FechaI=2024-03-01&FechaF=2024-05-31' ;
        console.log('dataurlAct'+ dataurlAct);
        // recuperamos la serie con jQuery
        function onDataReceivedAct(serie) {
           //alert(serie.data);
           data1Act=serie.data;
           //alert(est[1].id);
           i=197;
           $('#TituloPPAct').html( 'Precipitaci&oacute;n (mm) <br> Est: '+est[i].id +' - "' + est[i].nom + '" / lat: '+est[i].lat+ ' / lon: '+est[i].lng+ ' / alt: '+est[i].alt +' m');
            
            $.plot($('#preholderAct'), [{data: serie.data,color:'blue'}],
             {
             bars: { show: true,
                     align: 'center'
                   },
             crosshair: { 
                     mode: 'x'
                   },       
     		xaxis: {
                ticks: FechaAct,
                 font: { 
                        size: 8,   family: 'verdana',style :'normal', color : 'black'
                         },
                     
                    
                },             
             yaxis: {
                min:0,
                max: 125,
                ticks : [0,25,50,75,100,125],
                font: { 
                        size: 8,   family: 'verdana',style :'normal', color : 'black'
                      }  
               }  ,
            grid: {
    				hoverable: true,
    				clickable: true ,
    				autoHighlight: true,  
             }
             
             });
        };
    
        $.ajax({
            url: dataurlAct,
            method: 'GET',
            async: false,
            dataType: 'json',
            success: onDataReceivedAct,
            error: function (request, status, error) {
        		//Muestra el error en caso de problemas
        		alert(error)
   			 }
        });
        
      $('#preholderAct').bind('plothover', function (event, pos, item) {
        //alert('entre aca');
            if (item) {
                if (previousPoint != item.datapoint) {
                    previousPoint = item.datapoint;

                    $('#tooltip').remove();
                    var x = item.datapoint[0].toFixed(0),
                        y = item.datapoint[1].toFixed(2);
                        pr=data1Act[x];
                        
                        showTooltip(item.pageX, item.pageY,
                                 'pp= '+pr[1]+' mm');
                }
            }
            else {
                $('#tooltip').remove();
                previousPoint = null;
            }
        
       });        
        
   });