kopia lustrzana https://github.com/FacilMap/facilmap
Adding labels when hovering objects
rodzic
a44c18f13b
commit
0c289d3afe
|
@ -336,6 +336,17 @@ textarea {
|
||||||
right: auto;
|
right: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.fp-map-label {
|
||||||
|
position: absolute;
|
||||||
|
background-color: #fff;
|
||||||
|
z-index: 1010;
|
||||||
|
border: 1px solid #000;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 3px 6px;
|
||||||
|
opacity: .5;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/********* z-index **************/
|
/********* z-index **************/
|
||||||
|
|
||||||
|
|
|
@ -54,11 +54,23 @@
|
||||||
map.map.addLayer(map.layerLines);
|
map.map.addLayer(map.layerLines);
|
||||||
|
|
||||||
map.featureHandler = new OpenLayers.Handler.Feature(null, map.layerLines, {
|
map.featureHandler = new OpenLayers.Handler.Feature(null, map.layerLines, {
|
||||||
"over" : function() {
|
"over" : function(obj) {
|
||||||
$(map.map.div).addClass("fp-overFeature");
|
$(map.map.div).addClass("fp-overFeature");
|
||||||
|
|
||||||
|
if(!obj.fpLabel) {
|
||||||
|
if(obj.fpMarker && obj.fpMarker.name)
|
||||||
|
obj.fpLabel = map.showLabel(obj.fpMarker.name, obj.fpMarker, { x: 10, y: 0 });
|
||||||
|
else if(obj.fpLine && obj.fpLine.name)
|
||||||
|
obj.fpLabel = map.showLabel(obj.fpLine.name, map.xyToPos(map.featureHandler.evt), { x: 15, y: 0 }, true);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"out" : function() {
|
"out" : function(obj) {
|
||||||
$(map.map.div).removeClass("fp-overFeature");
|
$(map.map.div).removeClass("fp-overFeature");
|
||||||
|
|
||||||
|
if(obj.fpLabel) {
|
||||||
|
obj.fpLabel.close();
|
||||||
|
obj.fpLabel = null;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"click" : function(obj) {
|
"click" : function(obj) {
|
||||||
obj.fpOnClick(map.xyToPos(map.featureHandler.up));
|
obj.fpOnClick(map.xyToPos(map.featureHandler.up));
|
||||||
|
@ -191,6 +203,7 @@
|
||||||
};
|
};
|
||||||
|
|
||||||
var feature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(points).transform(fpUtils.proj(), map.map.getProjectionObject()), null, style);
|
var feature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(points).transform(fpUtils.proj(), map.map.getProjectionObject()), null, style);
|
||||||
|
feature.fpLine = line;
|
||||||
feature.fpOnClick = function(clickPos) {
|
feature.fpOnClick = function(clickPos) {
|
||||||
map.mapEvents.$emit("clickLine", line, clickPos);
|
map.mapEvents.$emit("clickLine", line, clickPos);
|
||||||
};
|
};
|
||||||
|
@ -320,6 +333,26 @@
|
||||||
map.map.getControlsByClass("FacilMap.Control.Loading")[0].loadEnd();
|
map.map.getControlsByClass("FacilMap.Control.Loading")[0].loadEnd();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
map.showLabel = function(label, pos, offset, updateOnMove) {
|
||||||
|
var xy = map.posToXy(pos);
|
||||||
|
var el = $("<div/>").addClass("fp-map-label").text(label).css({ top: (xy.y+offset.y)+"px", left: (xy.x+offset.x)+"px" }).appendTo(map.map.div);
|
||||||
|
|
||||||
|
var updatePosition = function(e) {
|
||||||
|
el.css({ top: (e.y+offset.y)+"px", left: (e.x+offset.x)+"px" });
|
||||||
|
};
|
||||||
|
|
||||||
|
if(updateOnMove)
|
||||||
|
map.map.events.register("mousemove", null, updatePosition);
|
||||||
|
|
||||||
|
return {
|
||||||
|
close: function() {
|
||||||
|
el.remove();
|
||||||
|
if(updateOnMove)
|
||||||
|
map.map.events.unregister("mousemove", null, updatePosition);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
map.messages = fpMapMessages(map);
|
map.messages = fpMapMessages(map);
|
||||||
map.popups = fpMapPopups(map);
|
map.popups = fpMapPopups(map);
|
||||||
map.markersUi = fpMapMarkers(map);
|
map.markersUi = fpMapMarkers(map);
|
||||||
|
|
Ładowanie…
Reference in New Issue