annotorious / annotorious-openseadragon

An OpenSeadragon plugin for annotating high-res zoomable images
https://annotorious.github.io
BSD 3-Clause "New" or "Revised" License
121 stars 43 forks source link

Adding two separate distinct svg Annotations #198

Open abhinav2712 opened 4 months ago

abhinav2712 commented 4 months ago

Lets say I hace defined one w3cAnno1 like this:


const w3cAnno1 = {
      id: Date.now(), // Unique ID for the first annotation
      type: "Annotation",
      target: {
        selector: {
          conformsTo: "http://www.w3.org/TR/media-frags/",
          type: "SvgSelector",
          value: `<svg><polygon points='100,360 423,360 432,932 100,932 100,360'></polygon></svg>`,
        },
      },
    };

here, I can save only one polygon on osd if i use addAnnotation , what if I want to save two distinct separate polygons on osd at once? I tried defining w3cAnno2 like:


const w3cAnno2 = {
      id: Date.now(), // Unique ID for the second annotation
      type: "Annotation",
      target: {
        selector: {
          conformsTo: "http://www.w3.org/TR/media-frags/",
          type: "SvgSelector",
          value: `<svg><polygon points='500,360 923,360 932,932 500,932 500,360'></polygon></svg>`, // Example points for the second polygon
        },
      },
    };

then tried to save both of them:


annotorious.addAnnotation(w3cAnno2, true);
    annotorious.addAnnotation(w3cAnno1, true);

but this doesnt work.... anyone have possible solution?

Whao510 commented 4 months ago

let annotationList = [{},{},{},....] annotationList.forEach(item=>{ anno.addAnnotation(item) });