+- Atozed Forums (https://www.atozed.com/forums)
+-- Forum: Atozed Software (https://www.atozed.com/forums/forum-1.html)
+--- Forum: IntraWeb (https://www.atozed.com/forums/forum-3.html)
+---- Forum: English (https://www.atozed.com/forums/forum-16.html)
+----- Forum: IntraWeb General Discussion (https://www.atozed.com/forums/forum-4.html)
+----- Thread: Image mapping (/thread-1975.html)
Image mapping - bostjan - 09-16-2020
Hi,
I have an image with some information that i wish to make clickable. Since picture is responsive I cannot get correct coordinations so the only solution I found is to make image map. Is there any example how to make it with Intraweb or could I get some pointers how to insert map info into html?
Kind regards,
Bostjan
RE: Image mapping - Alexandre Machado - 09-20-2020
TIWImage.OnAsyncMouseDown is the event that you are looking for.
Add an OnAsyncMouseDown event to your image and add this code to it:
Code:
procedure TIWForm1.IWImage1AsyncMouseDown(Sender: TObject; EventParams: TStringList);
var
x, y: Integer;
begin
x := imagMap.GetAsyncParam('X', 0);
y := imagMap.GetAsyncParam('Y', 0);
WebApplication.ShowMessage('X = ' + IntToStr(x) + ', Y = ' + IntToStr(y));
end;RE: Image mapping - bostjan - 09-20-2020
(09-20-2020, 04:57 AM)Alexandre Machado Wrote: TIWImage.OnAsyncMouseDown is the event that you are looking for.
Add an OnAsyncMouseDown event to your image and add this code to it:
Code:procedure TIWForm1.IWImage1AsyncMouseDown(Sender: TObject; EventParams: TStringList);
var
x, y: Integer;
begin
x := imagMap.GetAsyncParam('X', 0);
y := imagMap.GetAsyncParam('Y', 0);
WebApplication.ShowMessage('X = ' + IntToStr(x) + ', Y = ' + IntToStr(y));
end;
Hi, Alexandre!
Thank you for your answer. Unfortunatelly I'm trying to use bootstrap image and the coordinates are changing according to image size. For example original image size is 1000 x 1000. If I clicked on lower right corner, I get coordinate 1000x1000 (on PC browser), but when I checked that image on the phone and clicked on the same position, I'm getting coordinate 500x500. Is there any way to get image size after adapting new size or maybe to get scaled ratio on that image so I could figure out position based on original size?
Kind regards,
Bostjan