¿Cómo cambio el color de fondo de eventos con diferentes colores, en fullcalendar?

Question

Estoy usando la última versión de fullcalendar, miré en la documentación cómo cambiar el evento de color de fondo, pero no sé cómo hacer para diferentes eventos.
Necesito una muestra de código con eventos rojo, azul, verde, como la imagen.

veo este código, en el lugar del documento, pero no se puede aplicar 2 colores:

$('#calendar').fullCalendar({ 
     editable: true,    events: [ 
      { 
       title: 'Teste1', 
       start: new Date(y, m, d, 10, 30), 
       allDay: false, 
       editable: false 
      }, 
      { 
       title: 'Teste2', 
       start: new Date(y, m, d, 11, 40), 
       allDay: false 
      }   ], eventColor: '#378006'  }); 

Answer 1

dado que está utilizando la versión más reciente (1.5), se puede establecer la propiedad backgroundColor.

{ 
    title: 'Teste1', 
    start: new Date(y, m, d, 10, 30), 
    allDay: false, 
    editable: false, 
    backgroundColor: '#SomeColor' 
}, 
{ 
    title: 'Teste2', 
    start: new Date(y, m, d, 11, 40), 
    allDay: false, 
    backgroundColor: '#SomeOtherColor' 
} 

También puede establecer la propiedad textColor si necesita cambiar eso también.

Answer 2

utilizar CSS y la propiedad className.

<style> 
.event { 
    //shared event css 
} 

.greenEvent { 
    background-color:#00FF00; 
} 

.redEvent { 
    background-color:#FF0000; 
} 
</style> 

<script> 
$('#calendar').fullCalendar({ 
     editable: true,    events: [ 
      { 
       title: 'Teste1', 
       start: new Date(y, m, d, 10, 30), 
       allDay: false, 
       editable: false, 
       className: ["event", "greenEvent"] 
      }, 
      { 
       title: 'Teste2', 
       start: new Date(y, m, d, 11, 40), 
       allDay: false, 
       className: ["event", "redEvent"] 
      }   ], eventColor: '#378006'  }); 
</script> 

Answer 3

He aplicado el código de color de esta manera para cada evento. Funciona para mí.

$.each(data, function(i, v){  
    var event =[];  
    var col = "";   
          if(v.Status == 1)  
          { 
           col = "#00c0ef"; 
          } 
          else if(v.Status == 2){ 
           col = "#dd4b39"; 
          }  
          else if (v.Status === 3) 
          {  
           col = "#f39c12"; 
          }  
          else { 
           col = "#00a65a"; 
          }  
         event.push({ 
          title: v.AssignedName + "\n Installation Date: \n" + da,  
          start: da,  
          backgroundColor: col,  
           textColor:'black'  
         }) 
});