234 Part III — Google Map Hacks
The function gets the reference to the text box that will be used to populate the label and sets a
default color for the label. The function also makes sure that the user has actually clicked the
map by checking the value of the global lastpointvariable:
function addpoint(pointtype) {
if (lastpoint) {
entityname = document.getElementById(“entityname”);
color = ‘#f2efe9’;
Next, the label object is created by setting the common TLabelproperties for all the different
types of entities. The index reference used here is important, so a simple incrementing value
is used:
var label = new TLabel();
label.id = ‘label’ + index++;
label.anchorLatLng = lastpoint;
label.anchorPoint = ‘topRight’;
label.content = content;
label.percentOpacity = 50;
For each entity type, the color is configured using a local variable, and the object is pushed onto
the array for each object type. These arrays will be used when the user hides or shows object
groups on the map. Although the definition of the object is not complete at the time it is
pushed onto the array (the label content has not been set), the object ID is enough to identify
the object when showing/hiding the labels.
if (pointtype == ‘object’) {
objectfinds.push(label);
color = ‘#f20000’;
}
if (pointtype == ‘trench’) {
trenchs.push(label);
color = ‘#f2ef00’;
}
if (pointtype == ‘ruin’) {
ruins.push(label);
color = ‘#f2efe9’;
}
If the object being created is a vase, the label content is populated with the appropriate HTML
containing the reference to the image of the vase, rather than the text of the input box:
if (pointtype == ‘vase’) {
objectfinds.push(label);
color = ‘#f20000’;
label.content = ‘<div style=”padding: 16px 24px 0px 0px; ;
background: url(topright.png) no-repeat top right;”> ;