Image map solution

I have a requirement to implement image maps on images inserted into dcrs.

Has anyone done this and how may do i proceed? All types of responses are welcome :-)

Find more posts tagged with

Comments

nipper

How do you normally proceed besides asking someone to do your job for you ?

An image map is an image and some XML. Collect that information and put it in the right spot. Easy.

This does assume your users will have the pixel coordinates required for an image map.

windy

How do you normally proceed besides asking someone to do your job for you ?

An image map is an image and some XML. Collect that information and put it in the right spot. Easy.

This does assume your users will have the pixel coordinates required for an image map.

Thx for your usual sarcastic response :-)

Per pixel coordinates, the users currently use dreamweaver to get the full map tag(including coordinates etc) and paste the html into their 3 party application. I am replicating their process in TeamSite. So I guess they will still have to get the coordinates via their usual process and just enter them into the DCT and my TPL will do the processing.

windy

I have 2 replicants of dcr.content.image-map and I would like to print the

tags out for each replicant.

How would I iterate through the replicant in my foreach statement?

I might be missing something, but in my dcr, I dont see a way of distinguising between one "dcr.content.image-map" another.

nipper

more details. XSL or TPL ?

Post your code, it is very easy in either case.

windy

Thanks, sorry forgot to post code - it's in a tpl.

[PHP]
 my $usemap = "#blockdiagram"; my $areashape = "rect"; my $areacoords = "95,273,173,300"; my $areaalt = "This is an image map test"; my $mapname = "blockdiagram"; iwpt_output("<img "); iwpt_output('ALT="'); iwpt_output("$alt" . '"'); iwpt_output(' USEMAP="'); iwpt_output("$usemap".'"'); iwpt_output(' src="'); iwpt_output("$imgpathjive"); iwpt_output("$img"); iwpt_output('"'. ' BORDER="0"'); iwpt_output("/>"); iwpt_output("<map "); iwpt_output(' NAME="'); iwpt_output("$mapname" . '"'); iwpt_output(' ID="'); iwpt_output("$mapname" . '"'); iwpt_output(">"); iwpt_output("<area "); iwpt_output(' SHAPE="'); iwpt_output("$areashape" . '"'); iwpt_output(' COORDS="'); iwpt_output("$areacoords" . '"'); iwpt_output(' ALT="'); iwpt_output("$areaalt" . '"'); iwpt_output("/>"); iwpt_output("</map>");

[/PHP]

The code above renders the hard coded shape, coords and alt

I added the foreach code below, but tip reading the image-map nodes in the dcr.

[PHP]

@imagemap = ('dcr.content.image-map');
foreach(@imagemap)

{
iwpt_output( "hello");
};

[/PHP]

This is the xml from the dcr

[PHP]

rect196,335,246,350LED Display

rect284,333,341,349Keyboard

[/PHP]

Book_modified.rptdesign

ISCBorisB

@imagemap = ('dcr.content.image-map'); That's incorrect. Instead:[php]my @imagemap = iwpt_dcr_list('dcr.content.image-map');[/php]Also, instead of

 iwpt_output("<img ");
 iwpt_output('ALT="');
 ...
 iwpt_output("/>");

try more efficient (and easier to maintain) [php]iwpt_output(qq( $alt

));[/php]

windy

That's incorrect. Instead:[php]my @imagemap = iwpt_dcr_list('dcr.content.image-map');[/php]Also, this is kindergarten:
  iwpt_output("  iwpt_output('ALT="');
  ...
  iwpt_output("/>");

Instead:[php]iwpt_output(qq());[/php]Kapish?

Thx .

nipper

As Bo said, your code can be made much easier

something like this would work as well:

[php]

my $usemap = "#blockdiagram";
my $areashape = "rect";
my $areacoords = "95,273,173,300";
my $areaalt = "This is an image map test";
my $mapname = "blockdiagram";

${iw_value name='$alt'/}$

[/php]

Build the HTML, replace the values with iw_value tags

windy

Deleted. Please ignore

windy

As Bo said, your code can be made much easier

something like this would work as well:

[php]

my $usemap = "#blockdiagram"; my $areashape = "rect"; my $areacoords = "95,273,173,300"; my $areaalt = "This is an image map test"; my $mapname = "blockdiagram";

[/php]

Build the HTML, replace the values with iw_value tags

Thanks nipper - i'll clean up the code once it's all working.

Untitled.png

nipper

have you read the TPL docs

http://YOUR-SERVER-HERE/iw/help/tst/pt/TeamSite__PT__iw_perl.html

ISCBorisB

how do I extract the shape, coords, and alt element... for each @imagemap

That's actually a good question! Assuming that variables are named after DCT Replicated Items[PHP]foreach my $entry (iwpt_dcr_list('dcr.content.image-map')) {
my $shape = iwpt_dcr_value('entry.shape');
my $coords = iwpt_dcr_value('entry.coords') ;
...
}[/PHP]

windy

Thanks nipper and ISCBoris - worked it out.