翻译者：syl
原文链接：https://iiif.io/api/cookbook/recipe/0004-canvas-size/

用例

您有一个图像准备注释，预计稍后将被更高的分辨率图像所取代。您希望提供一个足够高分辨率的坐标空间，以精确定位注释。IIIF 展示v3.0 允许您描述带有较大图像尺寸的画布，用您现在准备好的较小图像填充它，并捕获较小图像上的注释，以便在更换图像时将其适当地放置在较大的图像上。

实施说明

此专题说明了将画布视为坐标空间的重要性，而不是绝对像素或显示尺寸的重要性。画布尺寸（宽度和高度的无单位值）不必与画在画布上的内容的（像素）尺寸相关。此专题显示画布尺寸与图像尺寸不同，但图像完全填充画布。一个更复杂但并不罕见的情况（相关食谱中链接的食谱）是在同一画布上具有多个图像，其中每个图像可能具有不同的基于像素的分辨率，但必须调和到相同的画布坐标空间。

使画布坐标空间大于图像的像素空间：

• 你有回旋余地不知道你的替换图像尺寸会是什么，
• 当前版本上的注释将在较大的图像上具有一致的位置，并且
• 在较小的版本上绘制注释区域将通过拥有更多的屏幕空间来促进。

对于未知的未来替换图像，一个好的起点是，只要每个画布尺寸超过 1000，每个画布尺寸至少是当前图像相应像素尺寸的两倍。

最后，如果图像尺寸大于画布，则图像将被缩放以适合画布。

限制

纵横比应在源图像和画布之间保持一致。否则，您将看到不可预知的拉伸和/或扭曲。

例子

这个例子显示了一个带有单个Canvas的Manifest，其高度和宽度尺寸是图像像素尺寸的三倍，以便构建一个尺寸都大于1000px的Canvas。
JSON-LD|在 Universal Viewer中查看|在Mirador中查看

{
  "@context": "http://iiif.io/api/presentation/3/context.json",
  "id": "https://iiif.io/api/cookbook/recipe/0004-canvas-size/manifest.json",
  "type": "Manifest",
  "label": {
    "en": [
      "Still image from an opera performance at Indiana University"
    ]
  },
  "items": [
    {
      "id": "https://iiif.io/api/cookbook/recipe/0004-canvas-size/canvas/p1",
      "type": "Canvas",
      "height": 1080,
      "width": 1920,
      "items": [
        {
          "id": "https://iiif.io/api/cookbook/recipe/0004-canvas-size/page/p1/1",
          "type": "AnnotationPage",
          "items": [
            {
              "id": "https://iiif.io/api/cookbook/recipe/0004-canvas-size/annotation/p0001-image",
              "type": "Annotation",
              "motivation": "painting",
              "body": {
                "id": "https://fixtures.iiif.io/video/indiana/donizetti-elixir/act1-thumbnail.png",
                "type": "Image",
                "format": "image/png",
                "height": 360,
                "width": 640
              },
              "target": "https://iiif.io/api/cookbook/recipe/0004-canvas-size/canvas/p1"
            }
          ]
        }
      ]
    }
  ]
}

相关专题

• 简单图像清单
• [A/V 内容和行为属性][0000]