marker highlighting
This commit is contained in:
parent
52434ff06c
commit
14d86c06af
45
lib/map.js
45
lib/map.js
@ -6,6 +6,10 @@ define(function () {
|
||||
return function (d) {
|
||||
var m = L.circleMarker([d.nodeinfo.location.latitude, d.nodeinfo.location.longitude], iconFunc(d))
|
||||
|
||||
m.resetStyle = function () {
|
||||
m.setStyle(iconFunc(d))
|
||||
}
|
||||
|
||||
m.on('click', gotoAnything.node(d, false))
|
||||
m.bindLabel(d.nodeinfo.hostname)
|
||||
|
||||
@ -22,11 +26,17 @@ define(function () {
|
||||
|
||||
var lines = graph.map( function (d) {
|
||||
var opts = { color: linkScale(d.tq).hex(),
|
||||
weight: 4
|
||||
weight: 4,
|
||||
opacity: 0.5,
|
||||
dashArray: "none"
|
||||
}
|
||||
|
||||
var line = L.polyline(d.latlngs, opts)
|
||||
|
||||
line.resetStyle = function () {
|
||||
line.setStyle(opts)
|
||||
}
|
||||
|
||||
line.bindLabel(d.source.node.nodeinfo.hostname + " – " + d.target.node.nodeinfo.hostname + "<br><strong>" + showDistance(d) + " / " + showTq(d) + "</strong>")
|
||||
line.on('click', gotoAnything.link(d, false))
|
||||
|
||||
@ -38,9 +48,9 @@ define(function () {
|
||||
return lines
|
||||
}
|
||||
|
||||
var iconOnline = { color: "#1566A9", radius: 6, fillOpacity: 0.5 }
|
||||
var iconOffline = { color: "#D43E2A", radius: 6, fillOpacity: 0.5 }
|
||||
var iconNew = { color: "#558020", radius: 6, fillOpacity: 0.5 }
|
||||
var iconOnline = { color: "#1566A9", radius: 6, fillOpacity: 0.5, weight: 2, className: "stroke-first" }
|
||||
var iconOffline = { color: "#D43E2A", radius: 6, fillOpacity: 0.5, weight: 2, className: "stroke-first" }
|
||||
var iconNew = { color: "#558020", radius: 6, fillOpacity: 0.5, weight: 2, className: "stroke-first" }
|
||||
|
||||
return function (sidebar) {
|
||||
var self = this
|
||||
@ -98,6 +108,16 @@ define(function () {
|
||||
map.fitBounds(bounds, {paddingTopLeft: [sidebar.getWidth(), 0]})
|
||||
}
|
||||
|
||||
function resetMarkerStyles(nodes, links) {
|
||||
Object.keys(nodes).forEach( function (d) {
|
||||
nodes[d].resetStyle()
|
||||
})
|
||||
|
||||
Object.keys(links).forEach( function (d) {
|
||||
links[d].resetStyle()
|
||||
})
|
||||
}
|
||||
|
||||
function goto(dict, id) {
|
||||
var m = dict[id]
|
||||
if (m === undefined)
|
||||
@ -111,15 +131,26 @@ define(function () {
|
||||
bounds = L.latLngBounds([m.getLatLng()])
|
||||
|
||||
setView(bounds)
|
||||
m.openPopup(bounds.getCenter())
|
||||
|
||||
return m
|
||||
}
|
||||
|
||||
self.gotoNode = function (d) {
|
||||
goto(nodeDict, d.nodeinfo.node_id)
|
||||
resetMarkerStyles(nodeDict, linkDict)
|
||||
|
||||
var m = goto(nodeDict, d.nodeinfo.node_id)
|
||||
|
||||
if (m)
|
||||
m.setStyle({ fillColor: m.options.color, color: "orange", weight: 20, fillOpacity: 1, opacity: 0.7 })
|
||||
}
|
||||
|
||||
self.gotoLink = function (d) {
|
||||
goto(linkDict, linkId(d))
|
||||
resetMarkerStyles(nodeDict, linkDict)
|
||||
|
||||
var m = goto(linkDict, linkId(d))
|
||||
|
||||
if (m)
|
||||
m.setStyle({ weight: 7, opacity: 1, dashArray: "10, 10" })
|
||||
}
|
||||
|
||||
return self
|
||||
|
Loading…
Reference in New Issue
Block a user