Bring CoffeeCup Image Mapper cmap into Responsive Bootstrap - Post ID 270080


Registered User
2 posts

I purchased CoffeeCup Image Mapper 5.0 thinking I could bring it into Responsive Bootstrap Builder (trial version to determine if I should purchase for my User Assistance team). I cannot find any information on how to do this ... I can see how to include a Temp Map placeholder, but don't see any way to bring the .cmap in.

Help?! Thanks...


Registered User
2 posts

BTW I have the image map in thhe Bootstrap file, it just doesn't work (both the .cmap and the image being used for the map are in the same directory).

Here is the HTML code I copied in (it works fine when I preview the .cmap file in browsers):

<!-- Beginning of CoffeeCup Image Map -->
<img src="material utilization details panel.JPG" usemap="#material utilization details panel" border=0>
<map name="material utilization details panel">
<area shape="rect" coords="1,44,321,134" href="" alt="The name, grade, type, and density (in kilograms per meter cubed) of the material you either chose from the Material: drop-down menu or have set as a default material for yourself or at your deployment level. " title="The name, grade, type, and density (in kilograms per meter cubed) of the material you either chose from the Material: drop-down menu or have set as a default material for yourself or at your deployment level. ">
<area shape="rect" coords="2,131,319,210" href="" alt="Rough Mass is material mass used and wasted to manufacture a single part. Finish Mass is material mass of a single part after all manufacturing processes. Higher material utilization means a lower percentage of costly material waste. " title="Rough Mass is material mass used and wasted to manufacture a single part. Finish Mass is material mass of a single part after all manufacturing processes. Higher material utilization means a lower percentage of costly material waste. ">
<area shape="rect" coords="452,43,852,135" href="" alt="Displays stock form info IF process begins with formed material stock (sheets, bars, tubes, and plates). If available stock forms won’t work for the part’s dimensions, aPriori chooses costlier Virtual Stock. Consider re-design to fit stock. " title="Displays stock form info IF process begins with formed material stock (sheets, bars, tubes, and plates). If available stock forms won’t work for the part’s dimensions, aPriori chooses costlier Virtual Stock. Consider re-design to fit stock. ">
<area shape="rect" coords="453,140,889,210" href="" alt="Part Size is smallest enclosing box encompassing part. If the manufacturing process starts with stock, then Stock Size displays dimensions of best-available stock chosen by aPriori in the factory VPE. You can override aPriori and manually choose stock." title="Part Size is smallest enclosing box encompassing part. If the manufacturing process starts with stock, then Stock Size displays dimensions of best-available stock chosen by aPriori in the factory VPE. You can override aPriori and manually choose stock.">
</map>
<!-- End of CoffeeCup Image Map -->
Attachments:


VP of Software Development
49,402 posts

The .cmap file is your project file and only used by Image Mapper. If I had to guess, the having spaces and mixed file case letters in your image file name is probably causing your problems. The file name "material utilization details panel.JPG" should be "material-utilization-details.jpg". You will also not be able to use the Live Preview for this type of element. Instead, once you fix the other issues, use Preview On and test it in your browser.

Also, don't forget to add the JavaScript files to the Resources and paste in the script markup under Settings.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.