Save and load Annotator.js annotations

I am using Annotator.js 2.0.0 (docs here) to annotate a page. I am initialising the annotator as described in the documentation, like this:

var app = new annotator.App();
app.include(annotator.ui.main);
app.start();

I know that Annotator.js provides a storage module, but that requires implementing an API that doesn't work that well for my use case, as I need to associate annotations with specific pages and users, and get them by page / user - not just annotation id. Even then, it isn't clear to me how to actually display those annotations on the page.

My question is: how do I load and display these annotations on the page?

UPDATE: I figured out how to get the annotations, using a custom module:

function getAnnotation() {
    return {
    annotationCreated: (annotation) => window.annotations[annotation.id] = annotation,
    annotationUpdated: (annotation) => window.annotations[annotation.id] = annotation
  }
}

var app = new annotator.App();
app.include(annotator.ui.main);
app.include(getAnnotation);
app.start();

That allows me to save and update the annotation objects on window.annotations The return object provides functions for module hooks (which are basically events). One of these request hooks is start, which lets me run code when the annotator is initialised. However, I'm not sure what method to call to create annotations.

I've tried app.annotations.create(), but even if passed an annotation object created by annotator.js, it creates an annotation box (i.e. where the user can type), and doesn't actually create the annotation. So now, even though I'm able to save and update annotations, I'm still not able to programmatically create them (from localStorage or a custom backend API).

UPDATE 2: The documentation suggests that you can call the annotationsLoaded hook and then pass annotations data, but I don't see the format used to pass this data. I've tried it as an object formatted like this:

app.runHook('annotationsLoaded', { 0: {annotation object} });

And an array, as the API suggests that data should be returned:

app.runHook('annotationsLoaded', {"rows": [{annotation object}]);

None of these approaches are creating annotations on the page. What am I missing here?

from Save and load Annotator.js annotations