Annotation Notes in Embedded Visualization

280 views
Skip to first unread message

Kevin Ward

unread,
Mar 8, 2014, 12:21:30 PM3/8/14
to brat-...@googlegroups.com
Apologies if this is explained in documentation I've overlooked, but I'm interested in adding annotation notes in an embedded Brat visualization.  By annotation notes I mean pop-up information when hovering or clicking on an annotation like the one described in the normalization annotation feature.  I didn't see the JSON structure needed to do this described on the embedded tutorial page, is this possible?  If so, where should I be looking to dive deeper into the JSON formats for taking advantage brat features not specifically called out on that tutorial page?  


Pontus Stenetorp

unread,
Mar 8, 2014, 8:50:11 PM3/8/14
to brat-...@googlegroups.com
Dear Kevin,
You are correct in that the embedded visualisation page does not cover
all the features of the JSON format. In fact, I don't think that there
is a formal specification of it at this point. The server-side code
that processes the objects isn't the prettiest [1] (I think it should
have been wrapped together with the annotation objects, a note for any
future refactoring) but from what I can tell from the normalisation
specifics [2], the structure should look something like.

{
'normalizations: [
[
# Standard unique ID (N[0-9]+).
norm_ann_id,
# I am not entirely sure what the normalisation annotation
# type means, it appears not to be in use.
norm_ann_type,
# ID of the annotation to anchor the normalisation to.
norm_tgt_id,
# Database that is referenced by the annotation.
ref_db,
# ID inside of that database, used to build a URL to the
# database if I remember correctly.
ref_id,
# This should be the raw text that shows up in the UI.
ref_text
],
],
}

The corresponding normalisation unpacking code on the client side is
located here [3]. There is also a whole process of sending a database
over the wire, but I will have to delegate the answer to Sampo Pyysalo
on how exactly this work since I don't know the details very well. A
good read-up on how the normalisation works at a higher level is
available on the homepage [4], but I suspect it won't do without
diving into the code if you want to do the actual embedding.

@Sampo: I think you know the internals of the normalisation better
than me, can you fill in the details regarding the database packing?

Best regards,
Pontus Stenetorp

[1]: https://github.com/nlplab/brat/blob/master/server/src/document.py#L671
[2]: https://github.com/nlplab/brat/blob/master/server/src/document.py#L728
[3]: https://github.com/nlplab/brat/blob/master/client/src/visualizer.js#L730
[4]: http://brat.nlplab.org/normalization.html

Sampo Pyysalo

unread,
Mar 8, 2014, 9:05:23 PM3/8/14
to brat-...@googlegroups.com
Hi Kevin,

There are two categories of annotation that are visualized using a pop-up dialog, free-text notes ("comments") and normalization annotations.

As Pontus wrote, normalization annotations are basically DB references, and the displayed information is queried from the server. This makes normalization visualization largely incompatible with server-less embedded brat (ala http://brat.nlplab.org/embed.html), but if you can set up a server for normalization info, the instructions at http://brat.nlplab.org/normalization.html should help.

Alternatively, if text-only popups are enough, you can use the "comment" category of annotation. The JSON here should be of the form

    "comments": [
        ["T1", "AnnotatorNotes", "comment text goes here"]
    ]

... I can't seem to make this work on the live demo on the bottom of the page at http://brat.nlplab.org/embed.html now, though. Pontus, can you help here?

Cheers,

Sampo




--

---
You received this message because you are subscribed to the Google Groups "brat-users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to brat-users+...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Pontus Stenetorp

unread,
Mar 8, 2014, 9:24:25 PM3/8/14
to brat-...@googlegroups.com
On 9 March 2014 11:05, Sampo Pyysalo <sampo....@gmail.com> wrote:
>
> As Pontus wrote, normalization annotations are basically DB references, and
> the displayed information is queried from the server. This makes
> normalization visualization largely incompatible with server-less embedded
> brat (ala http://brat.nlplab.org/embed.html), but if you can set up a server
> for normalization info, the instructions at
> http://brat.nlplab.org/normalization.html should help.

Aren't DB details just served along with the annotation configuration?
I thought it was only the search functionality that required the
server.

> Alternatively, if text-only popups are enough, you can use the "comment"
> category of annotation. The JSON here should be of the form
>
> "comments": [
> ["T1", "AnnotatorNotes", "comment text goes here"]
> ]
>
> ... I can't seem to make this work on the live demo on the bottom of the
> page at http://brat.nlplab.org/embed.html now, though. Pontus, can you help
> here?

If I remember correctly, there was some hook that may have been
disabled in the embedding code that enabled the pop-ups. There was
some technical reason that Goran gave me, but I can't remember what. I
suspect this could be patched.

Regards,
Pontus

Goran Topic

unread,
Mar 9, 2014, 10:41:00 PM3/9/14
to brat-...@googlegroups.com
Hello Kevin and all.

> If I remember correctly, there was some hook that may have been disabled in the embedding code that enabled the pop-ups.

They are not disabled in the embedding code, they were never present
to begin with.

The issue is, embedded brat does not include the user interface - it
only renders the SVG. To do otherwise would defeat the purpose of
having the embeddable component. If you want to hook up your own user
interface to it, the hooks are all there on the dispatcher, but the
component that is doing it for you in full brat is just not there.
Here's a short example of how to use the hooks:

head.ready(function() {
var dispatcher = Util.embed(
'brat',
collData,
docData,
webFontURLs
);

var logArguments = function() {
console.log(arguments);
}
dispatcher.on('displaySpanComment', logArguments);
dispatcher.on('displayArcComment', logArguments);
dispatcher.on('displaySentComment', logArguments);
});

For function signatures (as well as to see what full brat does with
the arguments), you can refer to the corresponding functions in
client/src/visualizer_ui.js.

Hope this helps.


Goran

Kevin Ward

unread,
Mar 10, 2014, 8:17:23 AM3/10/14
to brat-...@googlegroups.com, ama...@mad.scientist.com
Goran,

You just answered my next five questions, using the dispatcher is exactly what I need for my use case.  Thank you very much for the help!

-Kevin
Reply all
Reply to author
Forward
0 new messages