Jannik ist mal gekommen, Morten und Angelo sind da, Johann und Thomas auch. Quint auch. Und sechs weitere. <\/p>\n\n\n\n
Angelo und Robert machen Minsky: <\/p>\n\n\n\n
\/*jslint\n browser, for\n *\/\n\/*global\n window, alert, console\n *\/\nvar HtmlElements = {\n baseDiv: \"\",\n output: \"\",\n minus: \"\",\n streckung: \"\",\n faktor: \"\",\n konstante: \"\"\n};\nvar BaseValues = {\n width: 1000,\n height: 500,\n vorzeichen: 1,\n streckungswert: 1\n};\nvar Output = {\n text: function (text) {\n \"use strict\";\n HtmlElements.output.innerHTML = text;\n },\n textAdd: function (text) {\n \"use strict\";\n HtmlElements.output.innerHTML = HtmlElements.output.innerHTML + \"<hr>\" + text;\n }\n};\nvar DotDiv = {\n get: function (color) {\n \"use strict\";\n var punkt;\n var div;\n punkt = document.createTextNode(\".\");\n div = document.createElement(\"div\");\n div.appendChild(punkt);\n HtmlElements.baseDiv.appendChild(div);\n div.style.color = color;\n div.style.position = \"absolute\";\n return div;\n },\n setAbsolutePosition: function (x, y, div) {\n \"use strict\";\n div.style.top = BaseValues.height - y + \"px\";\n div.style.left = BaseValues.width \/ 2 + x + \"px\";\n }\n};\n\nvar W = function(p) {\n\tvar bla = Math.sin(Math.PI\/p);\n\treturn 4*bla*bla;\n}\n \nvar Draw;\nDraw = {\n horizontalLine: function (start, end, y, color) {\n \"use strict\";\n var i = 0;\n var x;\n var div = false;\n for (i = start; i < end; i += 1) {\n div = DotDiv.get(color);\n x = i; \/\/ + BaseValues.width \/ 2;\n DotDiv.setAbsolutePosition(x, y, div);\n }\n },\n verticalLine: function (start, end, x, color) {\n \"use strict\";\n var i = 0;\n var y;\n var div = false;\n \/\/ x = x + BaseValues.width \/ 2;\n for (i = start; i < end; i += 1) {\n div = DotDiv.get(color);\n y = i;\n DotDiv.setAbsolutePosition(x, y, div);\n }\n },\n coordinateSystem: function () {\n \"use strict\";\n Draw.horizontalLine(-500, 500, 0, \"#AA0050\");\n Draw.horizontalLine(0, 100, 100, \"#aa0066\");\n Draw.verticalLine(-200, 500, 0, \"#000099\");\n Draw.verticalLine(0, 100, 100, \"#A00099\");\n },\n dot: function (x, y, color) {\n \"use strict\";\n var div = DotDiv.get(color);\n \tdiv.className = \"dot\";\n DotDiv.setAbsolutePosition(x, y, div);\n },\n parabola: function (faktor, konstante) {\n \"use strict\";\n var units = 100;\n var increment = 1 \/ units;\n var streckungsfactor = units \/ BaseValues.streckungswert;\n var x;\n var y;\n var color;\n \/\/ alert(BaseValues.vorzeichen);\n for (x = -1; x < 1; x += increment) {\n\/\/ y = 1 * konstante + Math.sqrt(1 - BaseValues.vorzeichen * BaseValues.streckungswert * (x * x)) + x * faktor;\n y = Math.sqrt(1 - BaseValues.vorzeichen * BaseValues.streckungswert * (x * x));\n \/\/ console.log(y);\n color = \"#ff0000\";\n Draw.dot(x * units, y * units, color);\n Draw.dot(x * units, -y * units, color);\n }\n var scheitelpunktX = BaseValues.vorzeichen * (-1) * faktor \/ 2 * streckungsfactor;\n var scheitelpunktY = BaseValues.vorzeichen * scheitelpunktX * scheitelpunktX \/ streckungsfactor + faktor * scheitelpunktX + konstante * units;\n var outputScheitelpunktX = scheitelpunktX \/ units;\n var outputScheitelpunktY = scheitelpunktY \/ units;\n Output.textAdd(\" - Scheitelpunkt(\" + outputScheitelpunktX.toFixed(4) + \"\/\" + outputScheitelpunktY.toFixed(4) + \")\");\n Draw.scheitelpunkt(scheitelpunktX, scheitelpunktY, \"#9030c9\");\n },\n minsky: function (x, y, d, e, color, units) {\n \"use strict\";\n\tvar iMax = 1000;\n for (var i = 0; i < iMax; i++) {\n\t\tx = x - d*y;\n\t\ty = y + e*x;\n\t\tDraw.dot(x * units, y * units, color);\n }\n },\n minsky_q: function (x, y, d, e, color, units) {\n \"use strict\";\n\tvar iMax = 1000;\n for (var i = 0; i < iMax; i++) {\n\t\tx = x - Math.floor(d*y);\n\t\ty = y + Math.floor(e*x);\n\t\tDraw.dot(x * units, y * units, color);\n }\n },\n scheitelpunkt: function (scheitelpunktX, scheitelpunktY, color) {\n \"use strict\";\n var div = DotDiv.get(color);\n div.style.padding = 0;\n div.style.fontSize = \"50px\";\n var y = Math.round(scheitelpunktY) + 31;\n var x = Math.round(scheitelpunktX - 4);\n DotDiv.setAbsolutePosition(x, y, div);\n }\n};\n\nvar ButtonClickFunctions = {\n zeichne: function () {\n \"use strict\";\n if (HtmlElements.minus.checked === true) {\n BaseValues.vorzeichen = -1;\n } else {\n BaseValues.vorzeichen = 1;\n }\n\n var faktor = HtmlElements.faktor.value;\n var konstante = HtmlElements.konstante.value;\n var konstantenOutput = \"\";\n if (konstante) {\n konstantenOutput = \" + \" + konstante;\n }\n var outputVorzeichen = \"\";\n if (BaseValues.vorzeichen === -1) {\n outputVorzeichen = \"-\";\n }\n var outputStreckungswert = \"\";\n if (HtmlElements.streckung.value > 0) {\n BaseValues.streckungswert = HtmlElements.streckung.value;\n } else {\n BaseValues.streckungswert = 1;\n }\n if (BaseValues.streckungswert !== 1) {\n outputStreckungswert = BaseValues.streckungswert;\n }\n\n Output.text(\"y = \" + outputVorzeichen + outputStreckungswert + \"x² + \" + faktor + \"x\" + konstantenOutput);\n Draw.minsky(faktor, konstante);\n },\n generateBulk: function () {\n \"use strict\";\n var select = document.getElementById(\"increment\");\n Output.text(\"ausgew\u00e4hlt: \" + select.value);\n var i = 0;\n var j = 0;\n for (i = -4; i <= 4; i += 1 * (select.value)) {\n Draw.parabola(i, 0);\n j += 1;\n if (j > 400) {\n alert(\"break at 400 iterations!!!\");\n break;\n }\n }\n }\n};\n\nwindow.onload = function () {\n \"use strict\";\n HtmlElements.baseDiv = document.getElementById(\"xsquare\");\n Draw.coordinateSystem();\n var neededElements = [\"output\", \"konstante\", \"faktor\", \"minus\", \"streckung\"];\n Object.keys(neededElements).forEach(function (key) {\n HtmlElements[neededElements[key]] = document.getElementById(neededElements[key]);\n \/\/ alert(neededElements[key]);\n });\n \/\/Draw.minsky(5.0,5.0,1,W(5), \"#f0000ff\", 30);\n \/\/Draw.minsky(26.0\/5.0,26.0\/5.0,Math.sqrt(W(50)),Math.sqrt(W(50)), \"#ff0000\", 30);\n Draw.minsky_q(15, -24, 1, W(7), \"#ff0000\", 4);\n Draw.minsky_q(15, -37, 1, W(7), \"#0000ff\", 4);\n Draw.minsky_q(15, -16, 1, W(7), \"#ff00ff\", 4);\n Draw.minsky_q(15, -4, 1, W(7), \"#ff0000\", 4);\n Draw.minsky_q(15, -12, 1, W(7), \"#ff0000\", 4);\n Draw.minsky_q(15, -49, 1, W(7), \"#ff0000\", 4);\n Draw.minsky_q(15, -55, 1, W(7), \"#ff0000\", 4);\n \n \/\/ for (i in neededElements) {\n \/\/ HtmlElements[neededElements[i]]= document.getElementById(neededElements[i]);\n \/\/ alert(neededElements[i]);\n \/\/ }\n \/\/ HtmlElements.output = document.getElementById(\"output\");\n \/\/ HtmlElements.konstante = document.getElementById(\"konstante\");\n \/\/ HtmlElements.faktor = document.getElementById(\"faktor\");\n \/\/ HtmlElements.minus = document.getElementById(\"minus\");\n \/\/ HtmlElements.streckung = document.getElementById(\"streckung\");\n};\n\n<\/code><\/pre>\n\n\n\n<\/p>\n\n\n\n
<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <title>parabeln<\/title>\n <type=\"text\/css\">\n <script src=\"minsky.js\">\n <\/script>\n <style>\n\tdiv.dot{\n\t\t#font-size: 4em;\n\t\tfont-size: 30px;\n\t}\n <\/style>\n<\/head>\n<body>\n<div style=\"position:absolute;top:80px;right:80px;border:1px solid red;padding:2em;width:400px\">\n <p>y = vorzeichen * streckung * x² + faktor * x + konstante<\/p>\n\n <p>\n <label for=\"minus\">minus<\/label><input type=\"checkbox\" id=\"minus\" value=\"\">\n <label for=\"faktor\">streckung:<\/label><input type=\"text\" size=\"1\" id=\"streckung\" >\n <label for=\"faktor\">faktor:<\/label><input type=\"text\" size=\"1\" id=\"faktor\" >\n <label for=\"konstante\">konstante:<\/label><input type=\"text\" size=\"1\" id=\"konstante\" >\n <\/input><button onclick=\"ButtonClickFunctions.zeichne()\">minsky<\/button>\n <\/p>\n <p>\n <button onclick=\"ButtonClickFunctions.generateBulk()\">automatisch von -4 bis + 4<\/button>\n <label for=\"increment\">Abstufung f\u00fcr Faktor<\/label>\n <select id=\"increment\"><option>1<\/option>\n <option>0.5<\/option><\n <option>0.25<\/option>\n <option>0.125<\/option>\n <\/select>\n <\/p>\n <p><button style=\"background-color:#ffac99\"><a href=\"\">von vorne<\/a><\/button>\n <\/p>\n <p id=\"output\" style=\"border:1px solid grey;padding:0.5em\">here comes output ...<\/p>\n\n<\/div>\n<div id=\"xsquare\" style=\"position:absolute\">\n\n<\/div>\n\n<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <title>canvas<\/title>\n <script src=\"canvas.js\">\n <\/script>\n<\/head>\n<body>\n <canvas id=\"myCanvas\" width=\"200\" height=\"200\" style=\"border:1px solid #000000;\">\n \n \n <\/canvas>\n\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n\/\/ That's how you define the value of a pixel \/\/\n\n\/\/ That's how you update the canvas, so that your \/\/\n\/\/ modification are taken in consideration \/\/\n\n\nwindow.onload = function () {\n\tvar canvas = document.getElementById(\"myCanvas\");\n\t\/\/~ var canvasWidth = canvas.width;\n\tvar canvasWidth = 200;\n\t\/\/~ var canvasHeight = canvas.height;\n\tvar canvasHeight = 200;\n\tvar ctx = canvas.getContext(\"2d\");\n\tvar canvasData = ctx.getImageData(0, 0, canvasWidth, canvasHeight);\n\t\n\tfunction drawPixel (x, y, r, g, b, a) {\n var index = (x + y * canvasWidth) * 4;\n console.log(index);\n canvasData.data[index + 0] = r;\n canvasData.data[index + 1] = g;\n canvasData.data[index + 2] = b;\n canvasData.data[index + 3] = a;\n}\nfunction updateCanvas() {\n ctx.putImageData(canvasData, 0, 0);\n}\n\tfor (var j = 1; j < 30; j ++) {\n\t\tfor (var i=0; i < 150; i++) {\n\t\t\tdrawPixel(j*3, i, 255, 0, 0, 255);\n\t\t}\n\t}\n\tdrawPixel(1, 2, 255, 0, 0, 255);\n\tdrawPixel(1, 3, 255, 0, 0, 255);\n\tupdateCanvas();\n};\n\n<\/code><\/pre>\n\n\n\n<\/code><\/pre>\n\n\n\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <title>canvas<\/title>\n <script src=\"canvas.js\">\n <\/script>\n<\/head>\n<body>\n <canvas id=\"myCanvas\" width=\"200\" height=\"200\" style=\"border:1px solid #000000;\">\n \n \n <\/canvas>\n\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<\/p>\n","protected":false},"excerpt":{"rendered":"
Jannik ist mal gekommen, Morten und Angelo sind da, Johann und Thomas auch. Quint auch. Und sechs weitere. Angelo und Robert machen Minsky:<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2942","post","type-post","status-publish","format-standard","hentry","category-allgemein"],"_links":{"self":[{"href":"https:\/\/wordpress.wvs-berlin.de\/index.php?rest_route=\/wp\/v2\/posts\/2942","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.wvs-berlin.de\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.wvs-berlin.de\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.wvs-berlin.de\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.wvs-berlin.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2942"}],"version-history":[{"count":3,"href":"https:\/\/wordpress.wvs-berlin.de\/index.php?rest_route=\/wp\/v2\/posts\/2942\/revisions"}],"predecessor-version":[{"id":2946,"href":"https:\/\/wordpress.wvs-berlin.de\/index.php?rest_route=\/wp\/v2\/posts\/2942\/revisions\/2946"}],"wp:attachment":[{"href":"https:\/\/wordpress.wvs-berlin.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2942"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.wvs-berlin.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2942"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.wvs-berlin.de\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2942"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}