Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Update link to go to OpenMRS Add-ons index instead

<html><head><title></title></head><body><div style="float:right;margin-left:1em;padding:1em;background:#eee">

Panel

<div>

Assigned to: Tor Lye

Mentor: Mike Seaton
</div></div>

Abstract

Background

As images (chest x-rays, photographs of rashes, etc.) are loaded into OpenMRS, we will need tools to allow users to view and manipulate these images. We would like a clinician to be able to bring up one of the images in OpenMRS and easily manipulate the image to view details and potentially annotate the image. For example, a radiologist could bring up a patient's chest x-ray, zoom in to part of the image and adjust the image contrast to diagnose tuberculosis, and then add their impression to the database  e.g., add an arrow to the image along with a comment like "this is consistent with tuberculosis."

...

The Google Maps Image Viewer module is based on Bmckown's Complex Obs Support system. It should only be installed in OpenMRS deployments built from the complex-obs branch. The complex obs system handles storage and loading of image files. The Google Maps Image Viewer provides an alternative to the default image hander for viewing and editing images.

The image viewer is implemented as an OpenMRS module and AJAX-based web application using the Google Maps API. This API is well suited for zooming and navigating through very large images while keeping bandwidth usage to a minimum. Another example of how the API can be used to great effect can be found here.

Features

An intuitive user interface based on Google Maps enables easy navigation of large images. Zooming and panning works just like in Google Maps. The browser progressively downloads portions of the image (image tiles) as needed. Annotations are overlaid on the image, these can easily be read, edited, moved or deleted. It is also possible to choose not to display annotations.

...

Usage notes

Getting the module

...

  • Make sure you are running the complex obs version of OpenMRS
  • Deploy the module in the normal way
  • Go to the Google Maps API page and get a developer key. This is free, but a Google account is required. Each key is valid for only one domain, so a new key must be obtained if the OpenMRS deployment is moved. More details about the developer key can be found here: http://code.google.com/apis/maps/faq.html#keysystem
  • Save the developer key in the OpenMRS global property mapsimageviewer.googleMapsDevKey. This may be done using the Manage Settings (formerly Global Properties pagefrom platform 1.8 downwards) page.
  • If using very large images, the image viewer will use a lot of memory. Please make sure that Java has a large heap space, refer to the wiki page on Troubleshooting Memory Errors. When the module is loaded, a new link appears in the Administration page, 'Complex obs list'. This allows easy access to any images that may be stored in the database.

Using the image viewerUsing the image viewer

  • Create a new concept:
    • set Class to GoogleImageViewer,
    • set Datatype to Complex,
    • set Handler to AnnotatedImageHandler
  • Add a new Observation and set Concept to the new concept created above.
    • Browse and upload an image.
    • Save the observation.
  • Click on the Value link or "View current complex value in a new window"
  • The new image would be displayed using the Google Maps Image Viewer
  • Click and drag the image or use the arrow buttons in the top left corner to pan and navigate.
  • Use the vertical slider in the top left corner or the mouse scroll wheel to zoom in and out.
  • The current zoom level is shown in the top right corner. Clicking that text changes the zoom level to 100%.
  • If the image has annotations, they are shown as red markers on the image. Click a marker to read the text.
  • Markers can be moved, edited or deleted. To place a new marker, double-click the desired location.
  • The bottom right corner contains a thumbnail view of the image. To hide it, click the small button with an arrow.

...