This project is a part of DocumentCloud.
DocumentCloud Notes are a minimalist and responsive way to display a highlighted region of an image.
Notes are represented as blob of JSON (and previously, wrapped in a dc.embed.noteCallback() function):
{
"id": 176629,
"page": 1,
"title": "The UN Logo",
"content": "The United Nations (UN) is an intergovernmental organization established on 24 October 1945 to promote international co-operation. A replacement for the ineffective League of Nations, the organization was created following the Second World War to prevent another such conflict. At its founding, the UN had 51 member states; there are now 193. (Excerpted from \u003ca href=\"http://en.wikipedia.org/wiki/United_Nations\"\u003eWikipedia\u003c/a\u003e)",
"access": "public",
"location": {"image":"892,482,942,55"},
"image_url": "https://assets.documentcloud.org/documents/1282616/pages/undeclarationofhr-tl-p{page}-{size}.gif",
"published_url": "https://www.documentcloud.org/documents/1282616-undeclarationofhr-tl.html",
"canonical_url_":"https://www.documentcloud.org/documents/1282616-undeclarationofhr-tl/annotations/176629.html"
"resource_url":"https://www.documentcloud.org/documents/1282616-undeclarationofhr-tl/annotations/176629.js"
}
Notes can then be embedded with three things: a target DIV, the note JavaScript code, and an invocation to load the note resource:
<div id="DC-note-175279" class="DC-note-container"></div>
<script src="//assets.documentcloud.org/notes/loader.js"></script>
<script>
dc.embed.loadNote('//www.documentcloud.org/documents/1282616-undeclarationofhr-tl/annotations/175279.js');
</script>