Eventos JSON de color FullCalendar

we have a form which inserts event data into mysql table, this then feeds fullcalendar via JSON. Is it possible to set category colors, for example 'Holiday', 'Illness', 'Meeting'?

Our current json is like this, not sure how I would assign a colour to an event?

$jsonArray = array();
while($row = mysql_fetch_array($result, MYSQL_ASSOC))
{
 $id = $row['HolidayType'];
 $title = $row['name'];
 $start = $row['start'];
 $end = $row['end'];
 // Stores each database record to an array
 $buildjson = array('title' => "$title", 'start' => "$start", 'end' => "$end", 'allDay' => false);
 // Adds each array into the container array
 array_push($jsonArray, $buildjson);
}
// Output the json formatted data so that the jQuery call can read it
echo json_encode($jsonArray);

saludos cordiales

Gary

preguntado el 09 de marzo de 12 a las 16:03

3 Respuestas

De: los docs color
Sets an event's background and border color just like the calendar-wide eventColor option.

$('#calendar').fullCalendar({
    events: [
        {
            title  : 'event1',
            start  : '2010-01-01',
            color: 'red'
        }
    ]
});

respondido 09 mar '12, 23:03

Hi Sinetheta, I already have that code thank you, that just highlites all my events red, I need to differentiate events, some red, some yellow etc etc.. Thanks anyway. - Gris

Yes, that's why you have an array of events, so that they don't all have to be the same color. In your case it sounds like you would like color to depend on category. if($row['category'] == 'Holiday') { $color = 'blue'} - Sinetheta

Hi Sinetheta, thats exactly how I want to do it, could you please tell me how/where would I place the if statement to achieve this? Many thanks - Gris

It looks like you would add this in your $buildjson variable. Just add a "color" property to the array. As Sintheta mentions you'll need to work out on your own how you pull which color to use. - Greg

The way I have done this in my implementation is to have two or more eventSources see http://arshaw.com/fullcalendar/docs/event_data/Event_Source_Object/. Each eventSource has its own json feed which returns for example just meetings, the next just holidays etc... Each eventSource has it's own colour scheme using color and textColor or backgroundColor, borderColor and textColor. HTH.

Another way that was used on earlier versions of FullCalendar but can still be used is to have an extra param sent back with your json feed which contains a css class that would be used to 'color' the event. So any holidays could have a 'holiday' class, meetings a 'meeting' class etc.

respondido 11 mar '12, 20:03

If you are using 1.5 or better then you can use eventSources... see arshaw.com/fullcalendar/docs/event_data/events_json_feed. Within the eventSources you would list your individual events: as you have above. - Mych

Hi there, I have also added a 2nd event source, the calendar will now only show the 2nd event source though for some reason? Code looks like this events : { url: '1st_json-events.php', color: 'yellow', textColor: 'black', url: '2nd_json-events.php', color: 'red', textColor: 'white' }</pre> This now only shows events from the second source, any ideas where I am going wrong? - Gris

Juts to add to this, I am pulling the eventtype through to json as 'holiday', 'sickness' ect. Could I create css for these, maybe easier to manage that way? - Gris

Adding color variable to json array will change color for all events. For instance, if you have switch/case or nested ifelse to assign different colors to different events, it will not happen because the 'color' variable in fullcalendar will take the last color value and assign it to all events.

Respondido 02 Abr '14, 09:04

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.