lab2 init

labs/lab2/JavaScript/main.js

@@ -0,0 +1,47 @@
+document.addEventListener("DOMContentLoaded", function () {
+    const width = 600;
+    const height = 600;
+    const svg = d3.select("svg")
+        .attr("width", width)
+        .attr("height", height);
+
+    // let pict1 = drawSmile(svg);
+    // pict1.attr("transform", `translate(400, 400) scale(1.5, 1.5) rotate(180)`);
+
+    // let pict = drawSmile(svg);
+    // pict.attr("transform", "translate(200, 200)");
+
+    setting.applyButton.addEventListener("click", () => {
+        draw(setting);
+    })
+    setting.clearButton.addEventListener("click", () => {
+        svg.selectAll('*').remove()
+    })
+
+    enableAnimCheckbox.addEventListener("change", () => {
+        let isChecked = enableAnimCheckbox.checked;
+        if (isChecked) {
+            startAnimButton.display = "inline-block";
+            animTypeSelect.display = "inline-block";
+            applyButton.display = "none";
+        }
+        else {
+            startAnimButton.display = "none";
+            animTypeSelect.display = "none";
+            applyButton.display ="inline-block";
+        }
+    })
+})
+
+
+const draw = (dataForm) => {
+    const svg = d3.select("svg")
+    let pict = drawSmile(svg);
+    pict.attr("transform", `
+        translate(${dataForm.cx.value},
+        ${dataForm.cy.value})
+        scale(${dataForm.sx.value},
+        ${dataForm.sy.value})
+        rotate(${dataForm.r.value})`);
+
+}