mirror of
https://github.com/MISP/misp-galaxy.git
synced 2024-11-29 10:17:18 +00:00
Add [graph + table] scaling based on window
This commit is contained in:
parent
53f1c2c311
commit
c40130eab8
4 changed files with 15 additions and 12 deletions
|
@ -51,6 +51,9 @@ class Galaxy:
|
||||||
|
|
||||||
def _create_title_entry(self):
|
def _create_title_entry(self):
|
||||||
entry = ""
|
entry = ""
|
||||||
|
entry += f"[Hide Navigation](#){{ .md-button #toggle-navigation }}\n"
|
||||||
|
entry += f"[Hide TOC](#){{ .md-button #toggle-toc }}\n"
|
||||||
|
entry += f"<div class=\"clearfix\"></div>\n"
|
||||||
entry += f"[Edit :material-pencil:](https://github.com/MISP/misp-galaxy/edit/main/clusters/{self.json_file_name}){{ .md-button }}\n"
|
entry += f"[Edit :material-pencil:](https://github.com/MISP/misp-galaxy/edit/main/clusters/{self.json_file_name}){{ .md-button }}\n"
|
||||||
entry += f"# {self.galaxy_name}\n"
|
entry += f"# {self.galaxy_name}\n"
|
||||||
return entry
|
return entry
|
||||||
|
|
|
@ -290,18 +290,13 @@ document$.subscribe(function () {
|
||||||
.style("opacity", 0);
|
.style("opacity", 0);
|
||||||
|
|
||||||
// Set up the dimensions of the graph
|
// Set up the dimensions of the graph
|
||||||
var height = 1000;
|
|
||||||
var width = document.querySelector('.md-content__inner').offsetWidth;
|
var width = document.querySelector('.md-content__inner').offsetWidth;
|
||||||
|
var height = width;
|
||||||
|
|
||||||
// var svg = d3.select(elementId).append("svg")
|
|
||||||
// .attr("width", width)
|
|
||||||
// .attr("height", height)
|
|
||||||
|
|
||||||
var svg = d3.select("div#container")
|
var svg = d3.select("div#container")
|
||||||
.append("svg")
|
.append("svg")
|
||||||
.attr("preserveAspectRatio", "xMinYMin meet")
|
.attr("preserveAspectRatio", "xMinYMin meet")
|
||||||
.attr("viewBox", "0 0 825 1000")
|
.attr("viewBox", "0 0 " + width + " " + height)
|
||||||
.classed("svg-content", true);
|
.classed("svg-content", true);
|
||||||
|
|
||||||
// Create a force simulation
|
// Create a force simulation
|
||||||
|
@ -337,10 +332,8 @@ document$.subscribe(function () {
|
||||||
.attr("class", d => "node galaxy-" + d.galaxy.replace(/\s+/g, '-').replace(/[\s.]/g, '-'));
|
.attr("class", d => "node galaxy-" + d.galaxy.replace(/\s+/g, '-').replace(/[\s.]/g, '-'));
|
||||||
|
|
||||||
initializeNodeInteractions(node, link, tooltip, simulation, links, Parent_Node, NODE_RADIUS);
|
initializeNodeInteractions(node, link, tooltip, simulation, links, Parent_Node, NODE_RADIUS);
|
||||||
|
|
||||||
createGalaxyColorLegend(svg, width, galaxies, colorScale, node, link, tooltip);
|
createGalaxyColorLegend(svg, width, galaxies, colorScale, node, link, tooltip);
|
||||||
|
|
||||||
|
|
||||||
// Update positions on each simulation 'tick'
|
// Update positions on each simulation 'tick'
|
||||||
simulation.on("tick", () => {
|
simulation.on("tick", () => {
|
||||||
nodes.forEach(d => {
|
nodes.forEach(d => {
|
||||||
|
@ -414,10 +407,9 @@ document$.subscribe(function () {
|
||||||
col_1: "checklist",
|
col_1: "checklist",
|
||||||
col_3: "checklist",
|
col_3: "checklist",
|
||||||
col_4: "checklist",
|
col_4: "checklist",
|
||||||
col_widths: ["180px", "180px", "180px", "180px", "100px"],
|
|
||||||
col_types: ["string", "string", "string", "string", "number"],
|
col_types: ["string", "string", "string", "string", "number"],
|
||||||
grid_layout: false,
|
grid_layout: false,
|
||||||
responsive: false,
|
responsive: true,
|
||||||
watermark: ["Filter table ...", "Filter table ...", "Filter table ...", "Filter table ..."],
|
watermark: ["Filter table ...", "Filter table ...", "Filter table ...", "Filter table ..."],
|
||||||
auto_filter: {
|
auto_filter: {
|
||||||
delay: 100 //milliseconds
|
delay: 100 //milliseconds
|
||||||
|
|
|
@ -23,4 +23,8 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-typeset__table {
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
|
@ -69,7 +69,11 @@ def galaxy_transform_to_link(galaxy):
|
||||||
|
|
||||||
def generate_relations_table(cluster):
|
def generate_relations_table(cluster):
|
||||||
relationships = cluster.relationships
|
relationships = cluster.relationships
|
||||||
markdown = f"# {cluster.value} ({cluster.uuid}) \n\n"
|
markdown = ""
|
||||||
|
markdown += f"[Hide Navigation](#){{ .md-button #toggle-navigation }}\n"
|
||||||
|
markdown += f"[Hide TOC](#){{ .md-button #toggle-toc }}\n"
|
||||||
|
markdown += f"<div class=\"clearfix\"></div>\n"
|
||||||
|
markdown += f"# {cluster.value} ({cluster.uuid}) \n\n"
|
||||||
markdown += f"{cluster.description} \n\n"
|
markdown += f"{cluster.description} \n\n"
|
||||||
markdown += "|Cluster A | Galaxy A | Cluster B | Galaxy B | Level { .graph } |\n"
|
markdown += "|Cluster A | Galaxy A | Cluster B | Galaxy B | Level { .graph } |\n"
|
||||||
markdown += "| --- | --- | --- | --- | --- |\n"
|
markdown += "| --- | --- | --- | --- | --- |\n"
|
||||||
|
|
Loading…
Reference in a new issue