You are hereBlogs / daniel's blog / Easier Viewing of Large Images and Maps for Your Users

Easier Viewing of Large Images and Maps for Your Users


By daniel - Posted on 06 April 2007

I was off on a tangent and built a Flash component that behaves like the navigator palette in Photoshop... sort of like the inset map in Google Maps. It basically shows a thumbnail of a large image and allows a user to pan a highlighted region of the image. Typically this highlighted area corresponds to the visible portion of the image in some other viewport, as in the example below.

Free Download

I'm giving away this component for free so grab the download below!

Using the Minimap Component

To get the component working for you, follow these steps:

  1. Install the component using the Extension Manager (free download) and restart Flash
  2. Open a new Flash Document
  3. Drag a ScrollPane component onto the stage, name it "scrollPane," and set its size to 400x400
  4. Drag a Minimap component onto the stage and name it "minimap," and leave its size at 100x100
  5. Using the Component Inspector window, set the "contentPath" property for both components to "large_image.jpg". Make sure you have an image named "large_image.jpg" in the same directory as the output SWF.
  6. Publish!

You can also customize the highlight skin by creating a MovieClip with the linkage ID, "MinimapHighlightSkin." Enjoy!!

By the way, the test image above is from Halloween 2005. My parents' dog Katie was so scared of all the noise from the firecrackers that she was shaking wretchedly. So, I built her a bunker out of blankets and hid her deep inside it. The shaking subsided and she stayed protected in her little bomb shelter until the next morning. Poor dogs never enjoy Halloween.

About

Daniel McLaren

Daniel is a Flash and Flex developer specializing in the art of information visualization.

Syndicate content

SketchyD

Latest Drawing from SketchyD

This is the most recent drawing from my mobile sketch blog, SketchyD.com.

Popular Threads

Recent Comments