illustrator map to imagemap automatically? or is there a better way?

Question

I have a vector illustrator file with all the counties of California as distinct paths. I need to have these counties be links to other pages online. is there a way to automatically generate an HTML imagemap from this file? illustrator provides an export as a jpg function that has options for polygonal imagemap shapes, but it isn't working.

alternatively, do you have an opinion about the usage these days of imagemaps at all and whether I should approach this another way?

yes, I know I could do this in flash but I want to avoid that.

thanks!

Don't know much about imagemaps, but here's a way to make areas of your image interactive. http://stackoverflow.com/questions/3479361/how-to-create-an-image-with-hoverable-areas-that-show-additional-information-in/3479738#3479738 — Brandon Boone, Sep 30 '10 at 17:30

score 11 · Accepted Answer · answered Apr 23 '11 at 11:28

11

You can use the Attributes panel to set a link on each path, and then use Save for Web and Devices to save as HTML or HTML+Image -- that creates an imagemap in the HTML file.

answered Apr 23 '11 at 11:28

LHMathies

2,384
16
21

1

Note that this sort of stopped working in Illustrator CC (or maybe in CS5 already) -- the ability to save an HTML file is gone, but it will still show the HTML code on the preview (button at lower left of Save for Web and Devices). – LHMathies Jan 25 '14 at 18:00
1

Notice: On Illustrater CC 2014 the imagemap settings are hidden in the attributes panel. There is a little menu icon in the panel, which allows you to show the imagemap settings. – malisokan Jan 15 '15 at 14:02
Thanks, @Тони-- I haven't touched Illustrator in about a year, so I was not aware of this change. – LHMathies Jan 17 '15 at 06:49

score 3 · Answer 2 · edited Oct 27 '12 at 10:47

3

In addition to LHMathies answer please note that the path in Illustrator must not be a compound path in order to use the "Polygon" shape. The HTML output of a Compound Path will result in a "rectangle" shape.

To convert a compound path to a simple path right click the path and select Release Compound Path.

edited Oct 27 '12 at 10:47

Michael Schmidt

9,090
13
56
80

answered Jan 09 '12 at 22:34

Ryan

131
4

score 1 · Answer 3 · edited May 23 '17 at 12:17

1

Ah, I was looking for this very solution, and thanks to LHMathies' answer above, and ryandoss's tips, I worked out a complete mini-tutorial, which I put in this other SO thread.

I was able to create an imagemap from a Photoshop file in just a few minutes.

edited May 23 '17 at 12:17

Community

1
1

answered Dec 12 '12 at 20:34

bgmCoder

6,205
8
58
105

illustrator map to imagemap automatically? or is there a better way?

3 Answers3

Linked