4
0

clientlayer.js 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. define(["leaflet", "jshashes"],
  2. function (L, jsHashes) {
  3. var MD5 = new jsHashes.MD5()
  4. return L.TileLayer.Canvas.extend({
  5. setData: function (d) {
  6. this.data = d
  7. //pre-calculate start angles
  8. this.data.all().forEach(function (d) {
  9. var hash = MD5.hex(d.node.nodeinfo.node_id)
  10. d.startAngle = (parseInt(hash.substr(0, 2), 16) / 255) * 2 * Math.PI
  11. })
  12. this.redraw()
  13. },
  14. drawTile: function (canvas, tilePoint) {
  15. function getTileBBox(s, map, tileSize, margin) {
  16. var tl = map.unproject([s.x - margin, s.y - margin])
  17. var br = map.unproject([s.x + margin + tileSize, s.y + margin + tileSize])
  18. return [br.lat, tl.lng, tl.lat, br.lng]
  19. }
  20. if (!this.data)
  21. return
  22. var tileSize = this.options.tileSize
  23. var s = tilePoint.multiplyBy(tileSize)
  24. var map = this._map
  25. var margin = 50
  26. var bbox = getTileBBox(s, map, tileSize, margin)
  27. var nodes = this.data.search(bbox)
  28. if (nodes.length === 0)
  29. return
  30. var ctx = canvas.getContext("2d")
  31. var radius = 3
  32. var a = 1.2
  33. var startDistance = 12
  34. ctx.beginPath()
  35. nodes.forEach(function (d) {
  36. var p = map.project([d.node.nodeinfo.location.latitude, d.node.nodeinfo.location.longitude])
  37. var clients = d.node.statistics.clients
  38. if (clients === 0)
  39. return
  40. p.x -= s.x
  41. p.y -= s.y
  42. for (var orbit = 0, i = 0; i < clients; orbit++) {
  43. var distance = startDistance + orbit * 2 * radius * a
  44. var n = Math.floor((Math.PI * distance) / (a * radius))
  45. var delta = clients - i
  46. for (var j = 0; j < Math.min(delta, n); i++, j++) {
  47. var angle = 2 * Math.PI / n * j
  48. var x = p.x + distance * Math.cos(angle + d.startAngle)
  49. var y = p.y + distance * Math.sin(angle + d.startAngle)
  50. ctx.moveTo(x, y)
  51. ctx.arc(x, y, radius, 0, 2 * Math.PI)
  52. }
  53. }
  54. })
  55. ctx.fillStyle = "rgba(220, 0, 103, 0.7)"
  56. ctx.fill()
  57. }
  58. })
  59. })