Hi Mark,

just by coincidence, I found an example that did just that. So I had
to do the following:

1. Add the property "classname" to the JSON data (I am using the JSON
format). In my example, I used 'pojo'.
2. Look at the resulting rendering of the HTML. I found there:
<div class="tape-pojo pojo timeline-event-tape" id="tape0-tl-0-0-
e8" .../>
<div class="label-pojo pojo timeline-event-label" id="label-tl-0-0-
e8" .../>
3. Include in your CSS file rules about pojo, tape-pojo or label-pojo
to specify the display.

Just what I looked for, and it works great without changing any
Javascript code.

Thank's to all for the help and for that great tool.

Bye
        Markus

On Sep 21, 8:38 pm, mark47 <[email protected]> wrote:
> I'm attempting to do something somewhat similar to your original
> request, Markus.
>
> We have different categories within the same band and want them to
> look distinctive. I applied classname within the xml feed, then used
> CSS to style it. Very much a work in progress but it's 
> here:http://www.washington.edu/alumni/timeline/simile/index.html
>
> So in the XML, it outputs <event start="1917" title="Jeannette Rankin"
> classname="people"> or <event start="2004" title="Campus Event: Linda
> Buck Wins Nobel Prize" classname="events">. In the CSS, I specify a
> background color for each class.
>
> I've got some oddities that I'll write about in a separate post, but
> seems like a good way to differentiate.
>
> - Mark
>
> On Sep 21, 5:51 am, Jakob Fix <[email protected]> wrote:
>
>
>
> > you're right, I proposed two possible approaches:
> > * use the @icon attribute
> > * use any attribute (such as @type) you like, and then use
> > event.getProperty(), but you'd obliged to write some JS code to
> > actually use this in your timeline. I'm using this to filter events on
> > types, for example. indeed, event attributes are not (to my knowledge)
> > transferred to the final HTML.
>
> > there should be plenty of more useful examples on the simile website
> > that should help you use css.
>
> > cheers,
> > Jakob.
>
> > On Tue, Sep 21, 2010 at 08:04, mliebelt <[email protected]> 
> > wrote:
> > > Hi Jakob,
>
> > > On Sep 20, 6:30 pm, Jakob Fix <[email protected]> wrote:
> > >> I'm using the @icon attribute in my events XML file to specify the
> > >> icon to display. while this will work it's not elegant as the icon is
> > >> hard-coded. you could actually use whatever attribute you want and
> > >> then exploit it using event.getProperty(attrName), although I've only
> > >> used it for filtering so far. In the XML file referenced below, see
> > >> the @type and @agreement attributes.
>
> > >>http://eoi.oecdco.de/timeline.html+http://eoi.oecdco.de/timeline_data...
>
> > > I have looked at your example (thank's a lot for them, they are pretty
> > > nice), and I found the following:
>
> > > * Your type attribute is not visible any more in the HTML text
> > > rendered, an event looks there like:
> > > <div class="timeline-event-label" id="label-tl-0-0-e4" style="left:
> > > 2638px; width: 97px; top: 22px">G20 Toronto summit</div>
> > > <div class="timeline-event-icon" id="icon-tl-0-0-e733" style="left:
> > > 2562px; top: 6px">
> > > <img src="http://eoi.oecdco.de/js/timeline/src/webapp/api/images/green-
> > > circle.png"/>
> > > </div>
> > > * So by naming the icon, you can define the color (red vs. green).
> > > * Because the attributes class and id are used, I see no chance to
> > > enhance the display by just using CSS. But perhaps I could go with the
> > > icon idea.
>
> > > So thank you a lot for your answer
>
> > >> cheers,
> > >> Jakob.
>
> > > Bye
> > >         Markus
>
> > >> On Mon, Sep 20, 2010 at 15:32, mliebelt <[email protected]> 
> > >> wrote:
> > >> > Hi everyone,
>
> > >> > I am using currently timeline to display requests on a server, and it
> > >> > works great for us. We have identified problems we had just by looking
> > >> > at the graphical view instead of the textual log files.
>
> > >> > I would like now to enhance the graphical view by giving the events
> > >> > different colors (just to start with that). I looked around in the
> > >> > documentation, but I did not find any hint, that this exists. Instead,
> > >> > i found  onhttp://code.google.com/p/simile-widgets/wiki/Timeline_Ideas
> > >> > that the idea exists, but yet no implementation.
>
> > >> > What are options to differentiate events? I would like to do the
> > >> > following: Events working mostly in JSF will be displayed different to
> > >> > the ones that use mostly the database.
>
> > >> > Perhaps there is a workaround to get something different with a
> > >> > similar meaning.
>
> > >> > Bye
> > >> >      Markus
>
> > > --
> > > You received this message because you are subscribed to the Google Groups 
> > > "SIMILE Widgets" group.
> > > To post to this group, send email to [email protected].
> > > To unsubscribe from this group, send email to 
> > > [email protected].
> > > For more options, visit this group 
> > > athttp://groups.google.com/group/simile-widgets?hl=en.

-- 
You received this message because you are subscribed to the Google Groups 
"SIMILE Widgets" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to 
[email protected].
For more options, visit this group at 
http://groups.google.com/group/simile-widgets?hl=en.

Reply via email to