Adding two separate distinct svg Annotations

[abhinav2712]

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]

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