diff options
Diffstat (limited to 'sourcecodes/layout_svg_no.php')
| -rw-r--r-- | sourcecodes/layout_svg_no.php | 155 |
1 files changed, 78 insertions, 77 deletions
diff --git a/sourcecodes/layout_svg_no.php b/sourcecodes/layout_svg_no.php index 673da217..f32b4054 100644 --- a/sourcecodes/layout_svg_no.php +++ b/sourcecodes/layout_svg_no.php @@ -1,21 +1,11 @@ <!DOCTYPE html> <html> <head> -<style> -.button { - font-family: Times; - background-color: #33339F; - border: none; - color: white; - padding: 5px 5px; - text-align: center; - font-size: 16px; - } - -.button:hover { - background-color: blue; - } -</style> +<link rel="stylesheet" href="./scripts/font-awesome.css"> +<script src="./scripts/jquery.min.js"></script> +<script src="./scripts/accordion.js"></script> + + </head> <?php @@ -24,9 +14,10 @@ include("header_new.inc"); include("input_validate.php"); $keyval=valid_keyval($_GET["My_key"]); -$dir="./data/"; +//$dir="./data/"; +$dir="/var/lib/genenet/bnw/"; -$svg_file=$dir.$keyval."network_no_edge.svg"; +$svg_file=$keyval."network_no_edge.svg"; $png_file=$keyval."network_no_edge.png"; @@ -47,100 +38,110 @@ function calcHeight() //--> </script> +<!-- <script src="http://d3js.org/d3.v4.min.js" charset="utf-8"></script> <script src="http://d3js.org/d3-selection-multi.v1.js"></script> <script src="https://cdn.rawgit.com/eligrey/canvas-toBlob.js/f1a01896135ab378aa5c0118eadd81da55e698d8/canvas-toBlob.js"></script> <script src="https://cdn.rawgit.com/eligrey/FileSaver.js/e9d941381475b5df8b7d7691013401e171014e89/FileSaver.min.js"></script> +--> + +<script src="./scripts/d3.v4.min.js" charset="utf-8"></script> +<script src="./scripts/d3-selection-multi.v1.js"></script> +<script src="./scripts/canvas-toBlob.js"></script> +<script src="./scripts/FileSaver.min.js"></script> <!-- Site navigation menu --> <ul class="navbar2"> - <li><p>Network ID:<br><?php print($keyval);?></p></li> +<li class="noHover">Network ID:<br><?php print($keyval);?></li> +<li><a href="layout.php?My_key=<?php print($keyval);?>">Use network to make predictions</a></li> +</ul> + <button class="accordion">Network image options <i class="fa fa-angle-down" style="font-size: 18px;"></i></button> +<div class="panel"> +<ul class="navbar_ac"> +<?php +//$dir="/tmp/bnw/"; +$dir="/var/lib/genenet/bnw/"; +$filename1=$dir.$keyval."structure_input_temp.txt"; +if(file_exists($filename1)) + {?> +<li><a href="layout_svg_wt.php?My_key=<?php print($keyval);?>">Show network with edge weights</a></li> +<?php + } +?> +<button id='saveButton' class="button1">Save network as PNG</button> +<button id='saveButton_svg' class="button1">Save network as SVG</button> </ul> +</div> + <button class="accordion">More about network <i class="fa fa-angle-down" style="font-size: 18px;"></i></button> +<div class="panel"> +<ul class="navbar_ac"> + <li><a href="matrix_new.php?My_key=<?php print($keyval);?>" target="_blank">View structure matrix</a> + <li><a href="parameter_display.php?My_key=<?php print($keyval);?>" target="_blank">View network parameters</a> +<?php +$filename1=$dir.$keyval."slsettings.txt"; +if(file_exists($filename1)) + {?> + <li><a href="review_settings.php?My_key=<?php print($keyval);?>" target="_blank">View structure learning settings</a> +<?php +}?> + <li><a href="input_check.php?My_key=<?php print($keyval);?>" target="_blank">View input data and descriptions</a> +</ul> +</div> -<ul class="navbar"> -<li><a href="layout.php?My_key=<?php print($keyval);?>">Use network to make predictions</a> -<li><a href="layout_cyto.php?My_key=<?php print($keyval);?>" target='_blank'>Modify network structure</a> + <button class="accordion">Modify network structure <i class="fa fa-angle-down" style="font-size: 18px;"></i></button> +<div class="panel"> +<ul class="navbar_ac"> + <li><a href="layout_cyto.php?My_key=<?php print($keyval);?>" target='_blank'>Add or remove edges from network</a> <li><a href="modify_structure_learning.php?My_key=<?php print($keyval);?>" target='_blank';>Modify structure learning settings</a> - <li><a href="javascript:void(0);" -NAME="Model Averaging Matrix" title="Model Averaging Matrix" -onClick=window.open("matrix.php?My_key=<?php print($keyval);?>","Ratting","width=950,height=270,0,status=0,");>Display structure matrix</a> +<li><a href="remove_variables.php?My_key=<?php print($keyval);?>" target='_blank';>Remove variables from network and relearn structure</a> +</ul> +</div> +<ul class="navbar2"> + <li><a href="about_this_page.php#network_structure" target='_blank'>About this page</a> <li><a href="help.php" target='_blank'>Help</a> <li><a href="../home.php">Home</a> </ul> <div id="svg_div"> -<a href="layout_svg_wt.php?My_key=<?php print($keyval);?>"><button type="submit" class="button">Show edge weights</button></a> - - - -<button id='saveButton' class="button">Save network as PNG</button> - - - -<a href="<?php print($svg_file);?>" download><button type="submit" class="button">Save network as SVG</button></a> -<br> -<br> <script> - //onload = "makeDraggable(evt)"; -d3.xml("<?php print($svg_file);?>", function(error, documentFragment){ - if (error) {console.log(error); return;} - + + + + //onload = "makeDraggable(evt)"; +<?php +$svg_xml = json_encode(file("file://".$dir.$svg_file)); +?> +d3.xml("", function(dumm){ + var data1 = <?php echo $svg_xml;?>; + var data2 = data1.join("") + parser = new DOMParser(); + documentFragment = parser.parseFromString(data2,"text/xml"); var svgNode = documentFragment .getElementsByTagName("svg")[0]; d3.select("#svg_div").node().appendChild(svgNode); - // nodes = d3.selectAll('.node'); - // links = d3.selectAll('.edge'); width = svgNode.getBBox().width*5; height = svgNode.getBBox().height*5; - // nodes - // .call(d3.drag() - // .on("start",dragstarted) - // .on("drag",dragged) - // .on("end",dragended)); - - // links - // .call(d3.drag() - // .on("start",dragstarted) - // .on("drag",dragged) - // .on("end",dragended)); - - - //function dragstarted(d) { - // d3.select(this).raise().classed("active", true); - //} - - //function dragged(d) { - //this.x = this.x || 0; - //this.y = this.y || 0; - //this.x += d3.event.dx; - //this.y += d3.event.dy; - //d3.select(this) - // .attr("transform","translate(" + this.x + "," + this.y + ")"); - //} - - //function dragended(d) { - //d3.select(this).classed("active", false); - //} - - //console.log(svgNode); - //console.log(nodes); - //console.log(links); - - }); +}); </script> <script> + d3.select('#saveButton_svg').on('click',function() { + var svgString = getSVGString(d3.select("#svg_div").select('svg').node()); + var svgBlob = new Blob([svgString],{type:"image/svg+xml;charset=utf-8"}); + saveAs(svgBlob,"<?php echo $svg_file; ?>"); +}); + d3.select('#saveButton').on('click', function(){ var svgString = getSVGString(d3.select("#svg_div").select('svg').node()); @@ -261,4 +262,4 @@ function svgString2Image( svgString, width, height, format, callback ) { </div> </body> -</html> \ No newline at end of file +</html> |