Modifying/overriding the “.annotator-hl” stylesheet isn’t what I’m looking to 
do.  I was hoping to give individual annotations specific colours.

For example, annotations by Bob could appear in blue, whereas annotations by 
Milton could be red.  Another possible usage scenario would be to give 
priorities to annotations via their colour.  Red being the most important 
annotations on the page and so on.

I have determined that I can get all the currently existing annotation elements 
on a page document.getElementsByClassName(.annotator-hl).  I can iterate 
through this list and assign the colour based upon the data-annotation-id for 
that annotation element.

The above approach works, but I do not know when to do it.  The 
annotationCreated event fires after my annotation has been sent to the storage, 
but before it is drawn on the page – I cannot apply the colour to the 
annotation as it is not a page element yet, and thus cannot be found.  The 
annotationsLoaded event fires after I have fetches the annotations from 
storage, but before they are elements on the page.

Is there some way to get a list of all the annotations from storage?  I could 
possibly use a ‘then’ to apply the colour to the annotation elements after the 
app.annotations.load() promise completes?

Suggestions are welcome.

From: Randall Leeds [mailto:rand...@bleeds.info]
Sent: Friday, June 03, 2016 12:19 AM
To: Walker, Bernard; annotator-dev@lists.okfn.org
Subject: Re: [annotator-dev] How do I change an annotations colour?


Trivial or not depends on your goals.

Presently, there is not a way to specify an inline style, though it could be 
added.

Annotator uses its own, external stylesheet.

Whether the stylesheet or an inline style is appropriate depends on the 
environment.

Being able to set a custom class on a particular highlight span would also be 
an acceptable enhancement to enable more granular styling.

If your need is simply to change the color of all highlights, you can modify 
the CSS to change the ".annotator-hl" class styles, or leverage the manner in 
which stylesheets augment and override to provide different styles for that 
class in your own, external or embedded stylesheet.

On Thu, Jun 2, 2016, 07:30 Walker, Bernard 
<bernard.wal...@lsec.dnd.ca<mailto:bernard.wal...@lsec.dnd.ca>> wrote:
I am currently using Annotator 2.x, and I’m trying to change the colour of an 
annotation.  The only listing of the annotation format I can find is for the 
1.2 version (http://docs.annotatorjs.org/en/v1.2.x/annotation-format.html).  
Nowhere in that format do I see a way to specify the colour.  Annotorious has a 
style field; does the 2.X version of Annotator have something similar?

One would assume this would be trivial?

Bernard Walker, MSc.
Land Software Engineering Centre (LSEC)
Senior System Software Analyst - ICE
Phone 613-995-5627

Cha toir a’bhòidhchead goil air a’ phoit.

_______________________________________________
annotator-dev mailing list
annotator-dev@lists.okfn.org<mailto:annotator-dev@lists.okfn.org>
https://lists.okfn.org/mailman/listinfo/annotator-dev
Unsubscribe: https://lists.okfn.org/mailman/options/annotator-dev
_______________________________________________
annotator-dev mailing list
annotator-dev@lists.okfn.org
https://lists.okfn.org/mailman/listinfo/annotator-dev
Unsubscribe: https://lists.okfn.org/mailman/options/annotator-dev

Reply via email to