How to change color of timeline in annotated timeline?


I am new to Vaadin and am trying out VisualizationForVaadin’s (version 1.1) annotated time line component. I want to customize the color of individual timeline series (e.g. changing the color of line in the chart corresponding to ‘Sold Pencils’ and ‘Sold Pens’ in annotated time line example to something other than red and blue). I looked for documentation for annotated time line component but couldn’t find any. So I went to google’s visualization ( to see how to customize the color for individual timeline series and found that there is a configuration option ‘colors’, which can be used to change/customize the color. ‘colors’ configuration option takes an array of String as input.

I was not able to find any API on org.vaadin.vaadinvisualizations.AnnotatedTimeLine to set option that takes array of string. I tried using setOption call that takes a String (I gave a comma separated String of colors) but whenever I do that the timeline doesn’t show at all.

Can someone help in customizing the color of individual timeline series using AnnotatedTimeLine component?

I am using following configuration:
vaadin 6.4.5
Visualization for vaadin 1.1
gwt-visualization 1.1
JBoss 5.0


I debugged the code, it seems, that support for “object” type is prepared (will be a map, so can put key - value, pairs), but has not been finished yet. So we have to be patient and wait for the next release.

Oh…alright. Any idea when the new version will be released?


Hi, updated
, latest version 1.1.1 allows you to set colours for annotated time line as follows

yourTimeLine.setColors("orange", "slategray");

regards Phil

Wonderful! I tried out the latest (1.1.1) version of VisualizationsForVaadin and it works like charm.


Hi Phil,

great work. Will you update other components also, so that {param1, param2, …} setOption parameter will be supported?