Skip to main content
This is a pre-production deployment of Warehouse. Changes made here affect the production instance of PyPI (
Help us improve Python packaging - Donate today!

A wagtail module for creating an image field with annotation metadata

Project Description

Allows users to combine a Wagtail image with custom annotation data. Annotations are entered on the backend by clicking points on an image, annotation data is then stored with relative x,y coordinates with custom form data.


  • Wagtail >= 1.5
  • Django >= 1.9


Install using pypi

pip install wagtailannotatedimage


Extend the BaseAnnotationForm to define what data should be stored with annotations. AnnotationsField stores the annotations data as a Map with id for the annotation being the key.

from django.db import models
from wagtail.wagtailcore.models import Page
from wagtailannotatedimage.edit_handlers import AnnotatedImagePanel
from wagtailannotatedimage.fields import AnnotationsField
from wagtailannotatedimage.forms import BaseAnnotationForm

class AnnotationForm(BaseAnnotationForm):
    text = forms.CharField(widget=forms.TextInput)

class TestPage(Page):
    image = models.ForeignKey('wagtailimages.Image', blank=True, null=True,
                              on_delete=models.SET_NULL, related_name="+")
    annotations = AnnotationsField(blank=True)

    content_panels = Page.content_panels + [
            'image', 'annotations',
            annotation_form=AnnotationForm(), heading='Annotated Image'

Release History

This version
History Node


History Node


History Node


History Node


History Node


Download Files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

File Name & Hash SHA256 Hash Help Version File Type Upload Date
(10.7 kB) Copy SHA256 Hash SHA256
Source Nov 6, 2017

Supported By

WebFaction WebFaction Technical Writing Elastic Elastic Search Pingdom Pingdom Monitoring Dyn Dyn DNS Sentry Sentry Error Logging CloudAMQP CloudAMQP RabbitMQ Heroku Heroku PaaS Kabu Creative Kabu Creative UX & Design Fastly Fastly CDN DigiCert DigiCert EV Certificate Rackspace Rackspace Cloud Servers DreamHost DreamHost Log Hosting