I have 2 objects: one for the map (zoom/pan, ...), one for displaying
labels (more objects to come :)). The purpose of the labels class is
displaying a label of a map element like icons for restaurants,
streetnames, rivers, ... . In the SVG map I use
onclick="ShowLabel(evt)". How do I get this event handled by the Label
class.
This is the code for my labels (in a normal script file, not a js class
yet):
/**
* OnClick
*/
function ShowLabel(evt) {
var STROKEWIDTH = 2;
var FONTSIZE = 15;
var SPACEX = 5;
var OPACITY = 1;
var RX = 3;
var RY = 3;
var LINELENGTH = 10;
var group = svgdoc.createElement("g");
group.setAttribute("id", "label" + labelCount);
labelCount++;
group.setAttribute("onclick","OnClose(evt)");
var textNode =
svgdoc.createTextNode(evt.target.getAttribute("fme:NAME"));
var text = svgdoc.createElement("text");
text.appendChild(textNode);
text.setAttribute("x", evt.clientX - text.getComputedTextLength() /
2 - text.getComputedTextLength() * 0.25);
text.setAttribute("y", evt.clientY - FONTSIZE + 1);
text.setAttribute("fill","rgb(0,0,0)");
text.setAttribute("opacity",1);
text.setAttribute("font-size", FONTSIZE);
text.setAttribute("pointer-events","none");
var rect = svgdoc.createElement("rect");
rect.setAttribute("x", evt.clientX - text.getComputedTextLength() /
2 - SPACEX);
rect.setAttribute("y", evt.clientY - FONTSIZE * 1.2 - LINELENGTH);
rect.setAttribute("width", text.getComputedTextLength() + SPACEX * 2);
rect.setAttribute("height", FONTSIZE + FONTSIZE*0.2);
rect.setAttribute("opacity", OPACITY);
rect.setAttribute("fill","rgb(255,255,255)");
rect.setAttribute("stroke","rgb(0,0,0)");
rect.setAttribute("stroke-width",STROKEWIDTH);
rect.setAttribute("rx",RX);
rect.setAttribute("ry",RY);
var line = svgdoc.createElement("line");
line.setAttribute("x1", evt.clientX);
line.setAttribute("y1", evt.clientY);
line.setAttribute("x2", evt.clientX);
line.setAttribute("y2", evt.clientY - LINELENGTH);
line.setAttribute("stroke", "rgb(0,0,0)");
line.setAttribute("stroke-width", STROKEWIDTH);
var circle = svgdoc.createElement("circle");
circle.setAttribute("cx", evt.clientX);
circle.setAttribute("cy", evt.clientY);
circle.setAttribute("r", 3);
circle.setAttribute("stroke", "rgb(0,0,0)");
circle.setAttribute("fill", "rgb(255,255,255)");
circle.setAttribute("stroke-width", 2);
group.appendChild(rect);
group.appendChild(line);
group.appendChild(text);
group.appendChild(circle);
svgdoc.getElementById("Names").appendChild(group);
}
/**
* OnClose
*/
function OnClose(evt) {
try {
svgdoc.getElementById("Names").removeChild(svgdoc.getElementById(evt.currentTarget.getAttribute("id")));
labelCount--;
} catch (exception) {
alert(exception);
}
}
Disclaimer: http://www.kuleuven.be/cwis/email_disclaimer.htm
------------------------ Yahoo! Groups Sponsor --------------------~-->
Fair play? Video games influencing politics. Click and talk back!
http://us.click.yahoo.com/2jUsvC/tzNLAA/TtwFAA/1U_rlB/TM
--------------------------------------------------------------------~->
-----
To unsubscribe send a message to: [EMAIL PROTECTED]
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my
membership"
----
Yahoo! Groups Links
<*> To visit your group on the web, go to:
http://groups.yahoo.com/group/svg-developers/
<*> To unsubscribe from this group, send an email to:
[EMAIL PROTECTED]
<*> Your use of Yahoo! Groups is subject to:
http://docs.yahoo.com/info/terms/
