With the imagemap editor you can easily draw ALL the standard image map shapes (rectangle, circle, polygon), and you can have full control over the generated HTML code as well.
The Online Image Editor runs in your browser and the images are not uploaded to any server. You can download the repository.
- Close Polygon with SHIFT-Click for last point of polygon. Other points.
- Standard output image map is "Wiki Imagemap"
The fork is based on the ImageMap-Library by Adam Maschek. The purpose of the fork is to change the User Interface for MediaWiki imagemaps and Panorama360 image maps:
- Optimize workflow for ImageMap generation for users
- use JSZip to export a full HTML5 ImageMap Project.
- use FileSaver.js to save project files
- set the default imagemap main export format to the MediaWiki
- use the javascript code in an HTML file the docs/ folder in GitHub,
- rename buttons and change layout for the Source Selector,
- add a "Create Image Map" Button to the user interface.
- upload files with FileReader API - see [Code-Pen Example]](https://codepen.io/matt-west/pen/KjEHg)
- create a WebApp that works offline - no internet and server connectivity neccessary, if local images are used. Just download ZIP and start index.html in /docs folder.
The editor natively uses the canvas HTML element to draw the shapes on a given image. The ExplorerCanvas (http://excanvas.sourceforge.net/) library from Google is used to get the same result in browsers, that do not support the canvas element but can use VML instead. ExplorerCanvas works quite well, however it is still beta quality, and not as fast as the native canvas drawing, so expect some lags in IE. The editor is currently tested to work in Chrome, Firefox, Safari, Opera 9+ and IE 6+.
- The link https://en.wikipedia.org/wiki/Special:Redirect/file/Annweiler_Rathaus.JPG refers to the current version of the image Annweiler_Rathaus.JPG.
- Size of image can be determined by http://en.wikipedia.org/wiki/Special:FilePath/Annweiler_Rathaus.JPG?width=300 (here resize the width to 300 pixels.
- Online Image Editor
- Wikiversity support for Image Maps in MediaWiki
- Source code of Image Editor by Adam Maschek
- Adapted Source code of Image Editor by Adam Maschek in docs folder
- Download Link of Adapted ImageMap Editor
- Loading Images into a HTML5 WebApp needed for uploading local images provided by Eric Bidelman
- FileSaver.js by Eli Grey to emulate saving file (with the Download features of webbrowsers) in WebApps.
- JSZip to bundle the HTML5 files necessary for complete working example of the image map or the panorama image.
- JSZipUtils to download resources from a source.
Special thanks to Adam Maschek for sharing the code for Javascript ImageMap Editor on Github. See the original online editor at: http://www.maschek.hu/imagemap/imgmap
The forked image map editor was tailored for Wikiversity.
The code repository was originally hosted at google code and migrated to github on March 30, 2015