D3 Examples - ECM Explorer

xxxxxxxxxx
 
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v4.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
  <script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
​
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
  </style>
</head>
​
<body>
  <div id="byte_range"></div>
<div id="byte_content"></div>
  <script>
    var txtFile = "file.txt";
    var txtFileUrl = 'https://gist.githubusercontent.com/MingboPeng/e68e488045cbc74d9cbeb41ee87724f7/raw/file.txt';
    var htmlFile = "test.html";
    var htmlFileUrl = 'https://gist.githubusercontent.com/MingboPeng/e68e488045cbc74d9cbeb41ee87724f7/raw/test.html';
    var htmlFileUrl2 = 'https://gist.githubusercontent.com/MingboPeng/e68e488045cbc74d9cbeb41ee87724f7/raw/openstudio_results_copy_report.html';
    
    
    var svg = d3.select("body").append("svg")
      .attr("width", 960)
      .attr("height", 500)
    
    d3.text(htmlFileUrl, function(d){
      
      alert( "Load was performed." );
       //$( "#byte_content" ).html(d);
        
    })
    
    d3.html(htmlFileUrl2, function(d){
      var c = d3.select(d).select("#table_0 tbody").selectAll("tr");
      var htmlObj = c._groups[0];
      
      alert( "Load htmlFileUrl2 was performed." );
      var row = htmlObj[4];
      var textContent = row.cells[1].innerHTML;
      var textUnit = row.cells[2].innerHTML;
      alert( textContent);
      //c.forEach(myFunction)
      d3.selectAll("#byte_content").text(textContent + textUnit);
       //$( "#byte_range" ).html(c);
        
    })
    
​
    function Show(data){
      svg.append("text")
      .text(data)
      .attr("y", 200)
      .attr("x", 120)
      .attr("font-size", 36)
      .attr("font-family", "monospace")
      
    }
    
    function myFunction(item) {
      d3.select("#byte_content")
        .append("text")
      .text(item)
}
​
​
​
​
  </script>
</body>
​
    