lab3 p2 step5

2026-03-20 12:12:19 +10:00
parent 1121944fb1
commit c368e1eef8
3 changed files with 31 additions and 0 deletions
--- a/labs/lab3/CSS/style.css
+++ b/labs/lab3/CSS/style.css
@@ -0,0 +1,12 @@
+svg {
+    width: 800px;
+    height: 400px;
+}
+svg text {
+    font: 8px Verdana;
+}
+svg path, line {
+    fill: none;
+    stroke: #333333;
+    width: 1px;
+}
--- a/labs/lab3/JavaScript/chart.js
+++ b/labs/lab3/JavaScript/chart.js
@@ -0,0 +1,17 @@
+// Входные данные:
+//   data - исходный массив (например, buildings)
+//   key - поле, по которому осуществляется группировка
+
+function createArrGraph(data, key) {  
+  
+    const groupObj = d3.group(data, d => d[key]);
+
+    let arrGraph =[];
+    for(let entry of groupObj) {
+        const minMax = d3.extent(entry[1].map(d => d['Высота']));
+        arrGraph.push({labelX : entry[0], values : minMax});
+     }
+
+     return arrGraph;
+}
+
--- a/labs/lab3/index.html
+++ b/labs/lab3/index.html
@@ -7,9 +7,11 @@
  <script src="JavaScript/data.js"></script>
  <script src="JavaScript/main.js"></script>
  <script src="JavaScript/table.js"></script>
+  <script src="JavaScript/chart.js"></script>
 </head>
 <body>   
  <h3>Список самых высоких зданий</h3>
+  <svg></svg>
  <button id="tableVisibilityButton">Скрыть Таблицу</button>
  <table id="build"> 
  </table>