A corporation manager and dashboard for EVE Online
您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. var get_bounds = function(galaxy) {
  2. var xmin = Infinity, xmax = -Infinity,
  3. ymin = Infinity, ymax = -Infinity;
  4. for (var sid in galaxy) {
  5. var system = galaxy[sid];
  6. var x = system["coords"][0];
  7. var y = system["coords"][2];
  8. if (x < xmin) xmin = x;
  9. if (x > xmax) xmax = x;
  10. if (y < ymin) ymin = y;
  11. if (y > ymax) ymax = y;
  12. }
  13. var xspan = xmax - xmin;
  14. var yspan = ymax - ymin;
  15. return [xmin, ymin, xspan, yspan];
  16. }
  17. var get_sec_class = function(sec) {
  18. return "sec-" + (
  19. sec <= 0.0 ? "null" :
  20. Number(Math.max(sec, 0.1)).toFixed(1).replace(".", "_"));
  21. }
  22. var get_faction_class = function(factions, faction) {
  23. if (faction < 0)
  24. return "neutral";
  25. if (factions[faction] !== undefined)
  26. return "faction faction-" + S(factions[faction]["name"]).slugify();
  27. }
  28. $(function() {
  29. $("#map .preload").append($("<p>").text("Loading map data..."));
  30. $.getJSON( "map/data.json", data => {
  31. var galaxy = data["systems"];
  32. var factions = data["factions"];
  33. var systems = Object.values(galaxy);
  34. var jumps = [].concat
  35. .apply([], Object.keys(galaxy)
  36. .map(src => galaxy[src]["gates"]
  37. .map(dst => [parseInt(src), dst])))
  38. .filter(pair => pair[0] < pair[1]);
  39. var [xmin, ymin, xspan, yspan] = get_bounds(galaxy);
  40. var scale = 1000;
  41. var radius = scale / 2;
  42. var projx = x => ((x - xmin) / xspan - 0.5) * (scale * 0.99);
  43. var projy = y => -((y - ymin) / yspan - 0.5) * (scale * 0.99);
  44. $("#container > div").addClass("map-1");
  45. $("main").addClass("map-2");
  46. $("#map").addClass("map-3");
  47. $("#map .preload").remove();
  48. $("#map .controls").show();
  49. var svg = d3.select("#map").append("svg")
  50. .attr("viewBox", (-radius) + " " + (-radius) +
  51. " " + scale + " " + scale);
  52. var field = svg.append("g");
  53. field.selectAll("line")
  54. .data(jumps)
  55. .enter()
  56. .append("line")
  57. .attr("x1", d => projx(galaxy[d[0]]["coords"][0]))
  58. .attr("y1", d => projy(galaxy[d[0]]["coords"][2]))
  59. .attr("x2", d => projx(galaxy[d[1]]["coords"][0]))
  60. .attr("y2", d => projy(galaxy[d[1]]["coords"][2]))
  61. .attr("class", "jump")
  62. .style("stroke-width", 1);
  63. field.selectAll("circle")
  64. .data(systems)
  65. .enter()
  66. .append("circle")
  67. .attr("cx", d => projx(d["coords"][0]))
  68. .attr("cy", d => projy(d["coords"][2]))
  69. .attr("r", 2);
  70. var stars = field.selectAll("circle");
  71. var jumps = field.selectAll("line");
  72. var lastk = 1;
  73. var zoom = d3.zoom()
  74. .extent([[-radius, -radius], [radius, radius]])
  75. .scaleExtent([1, 63])
  76. .on("zoom", () => {
  77. var trans = d3.event.transform;
  78. var clamp = radius * (trans.k - 1);
  79. trans.x = Math.max(Math.min(trans.x, clamp), -clamp);
  80. trans.y = Math.max(Math.min(trans.y, clamp), -clamp);
  81. field.attr("transform", trans);
  82. $("#map-scale").val(Math.log2(trans.k + 1));
  83. if (Math.abs((trans.k - lastk) / lastk) > 0.1) {
  84. stars.attr("r", 6 / (trans.k + 2));
  85. jumps.style("stroke-width", 2 / (trans.k + 1));
  86. lastk = trans.k;
  87. }
  88. });
  89. svg.call(zoom);
  90. $("#map-scale").on("input", e => {
  91. var k = Math.pow(2, e.target.value) - 1;
  92. zoom.scaleTo(svg, k);
  93. });
  94. $('#map .controls input[name="color"]').change(function() {
  95. if (this.value == "sec") {
  96. stars.attr("class", d =>
  97. "system " + get_sec_class(d["security"]));
  98. }
  99. else if (this.value == "faction") {
  100. stars.attr("class", d =>
  101. "system " + get_faction_class(factions, d["faction"]));
  102. }
  103. });
  104. $("#map-color-sec").prop("checked", true).change();
  105. $(window).resize(() => {
  106. svg.style("display", "none")
  107. .attr("width", $("#map").width())
  108. .attr("height", $("#map").height())
  109. .style("display", "");
  110. });
  111. $(window).resize();
  112. });
  113. });