Merge branch 'master' into 0283-missing-image

_includes/links.md

@@ -45,6 +45,8 @@
 [0117]: {{ site.cookbook_url | absolute_url }}/recipe/0117-add-image-thumbnail/ "Manifest Thumbnail"
 [0118]: {{ site.cookbook_url | absolute_url }}/recipe/0118_multivalue/ "Displaying Multiple Values with Language Maps"
 
+[0135]: {{ site.cookbook_url | absolute_url }}/recipe/0135-annotating-point-in-canvas/ "Annotating a specific point of an image"
+
 [0154]: {{ site.cookbook_url | absolute_url }}/recipe/0154-geo-extension/ "Locate a Manifest on a Web Map"
 
 [0232]: {{ site.cookbook_url | absolute_url }}/recipe/0232-image-thumbnail-canvas/ "Implementation discussion: Thumbnails on Canvases"

index.md

@@ -87,6 +87,7 @@ _(leading on to segmentation examples later)_
 * [Tagging with an External Resource][0258]
 * hotspot linking
 * [Annotate a specific images or layers][0326]
+* [Annotating a specific point of an image][0135]
 * [Geographic coordinates][0139]
 * [Embedded or Referenced Annotations][0269]
 * [Linking external Annotations targeting a Canvas to a Manifest][0306]

recipe/0047-homepage/manifest.json

@@ -40,9 +40,9 @@
                 "format": "image/jpeg",
                 "service": [
                   {
-                    "@id": "https://iiif.io/api/image/3.0/example/reference/28473c77da3deebe4375c3a50572d9d3-laocoon",
-                    "@type": "ImageService3",
-                    "profile": "http://iiif.io/api/image/2/level1.json"
+                    "id": "https://iiif.io/api/image/3.0/example/reference/28473c77da3deebe4375c3a50572d9d3-laocoon",
+                    "type": "ImageService3",
+                    "profile": "level1"
                   }
                 ],
                 "height": 3000,

recipe/0135-annotating-point-in-canvas/index.md

@@ -0,0 +1,37 @@
+---
+title: Annotating a specific point of an image
+id: 15
+layout: recipe
+tags: image
+summary: "This recipe explains how to annotate a specific point of an image."
+viewers:
+topic:
+ - annotation
+---
+
+## Use Case
+You want to annotate a coordinate of the image rather than a region. You have a map with some locations that can be represented better by a single coordinate. You want to add some auxiliary data relative to a specific point of the image (e.g. some spectroscopic analysis made on a manuscript).
+
+## Implementation notes
+
+This recipe, as [Simple Annotation — Tagging][0021] implements a method for annotating an image. Recipe [Begin playback at a specific point - Time-based media][0015] uses a Point Selector for selecting a specific time of a video, this recipe selects instead a specific point of the image.
+
+In this use case, the Annotation is inside an Annotation Page in the `annotations` list of the Manifest. The `motivation` of the Annotation is "tagging" and the target `source` points to the Canvas `id`. The `type` property is a Specific Resource while the Selector `type` property is a Point Selector that contains the coordinates `x` and `y` of the Canvas coordinates system as parameters.
+
+Viewers might consider implementing scale-independent point markers so that they are visible at every level of zoom.
+
+## Example
+
+This example uses a leaflet with a map and a guide supplied by the Library of Congress Geography and Map Division, it shows how we can annotate some locations expressed in the map.
+
+{% include manifest_links.html viewers="" manifest="manifest.json" %}
+
+{% include jsonviewer.html src="manifest.json" config='data-line="74-82"' %}
+
+# Related recipes
+
+* [Begin playback at a specific point - Time-based media][0015] uses a Point Selector for selecting for starting the playback at a specific time.
+* [Simple Annotation — Tagging][0021] a simple annotation pointing to a region of an image.
+
+{% include acronyms.md %}
+{% include links.md %}

recipe/0135-annotating-point-in-canvas/manifest.json

@@ -0,0 +1,89 @@
+{
+  "@context": "http://iiif.io/api/presentation/3/context.json",
+  "id": "{{ id.url }}",
+  "type": "Manifest",
+  "label": {
+    "en": [
+      "Using a point selector for annotating a location on a map."
+    ]
+  },
+  "summary": {
+    "en": [
+      "A map containing an point with an annotation of the location."
+    ]
+  },
+  "items": [
+    {
+      "id": "{{ id.path }}/canvas.json",
+      "type": "Canvas",
+      "label": {
+        "en": [
+          "Chesapeake and Ohio Canal Pamphlet"
+        ]
+      },
+      "height": 5212,
+      "width": 7072,
+      "items": [
+        {
+          "id": "{{ id.path }}/contentPage.json",
+          "type": "AnnotationPage",
+          "items": [
+            {
+              "id": "{{ id.path }}/content.json",
+              "type": "Annotation",
+              "motivation": "painting",
+              "body": {
+                "id": "https://iiif.io/api/image/3.0/example/reference/43153e2ec7531f14dd1c9b2fc401678a-88695674/full/max/0/default.jpg",
+                "type": "Image",
+                "format": "image/jpeg",
+                "height": 5212,
+                "width": 7072,
+                "service": [
+                  {
+                    "id": "https://iiif.io/api/image/3.0/example/reference/43153e2ec7531f14dd1c9b2fc401678a-88695674",
+                    "type": "ImageService3",
+                    "profile": "level1"
+                  }
+                ]
+              },
+              "target": "{{ id.path }}/canvas.json"
+            }
+          ]
+        }
+      ],
+      "annotations": [
+        {
+          "id": "{{ id.path }}/page/p2/1",
+          "type": "AnnotationPage",
+          "items": [
+            {
+              "id": "{{ id.path }}/annotation/p0002-tag",
+              "type": "Annotation",
+              "label": {
+                "en": [
+                  "Annotation containing the name of the place annotated using the PointSelector."
+                ]
+              },
+              "motivation": "tagging",
+              "body": {
+                "type": "TextualBody",
+                "value": "Town Creek Aqueduct",
+                "language": "en",
+                "format": "text/plain"
+              },
+              "target": {
+                "type": "SpecificResource",
+                "source": "{{ id.path }}/canvas.json",
+                "selector": {
+                  "type": "PointSelector",
+                  "x": 3385,
+                  "y": 1464
+                }
+              }
+            }
+          ]
+        }
+      ]
+    }
+  ]
+}