Unterschiede
Hier werden die Unterschiede zwischen zwei Versionen angezeigt.
Beide Seiten der vorigen Revision Vorhergehende Überarbeitung Nächste Überarbeitung | Vorhergehende Überarbeitung Nächste ÜberarbeitungBeide Seiten der Revision | ||
start [2019/06/27 19:16] – gelöscht 91.21.188.178 | start [2022/08/18 22:19] – admin | ||
---|---|---|---|
Zeile 1: | Zeile 1: | ||
+ | < | ||
+ | |||
+ | // Display QR code to user | ||
+ | < | ||
+ | < | ||
+ | |||
+ | <iframe src=" | ||
+ | </ | ||
+ | |||
+ | {{: | ||
+ | |||
+ | < | ||
+ | < | ||
+ | </ | ||
+ | < | ||
+ | |||
+ | |||
+ | |||
+ | <meta charset=" | ||
+ | < | ||
+ | |||
+ | header { | ||
+ | font-family: | ||
+ | width: 240px; | ||
+ | height: 20px; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | form { | ||
+ | position: relative; | ||
+ | top: 1em; | ||
+ | left: 1em; | ||
+ | | ||
+ | } | ||
+ | |||
+ | path { | ||
+ | fill-rule: evenodd; | ||
+ | stroke: #333; | ||
+ | stroke-width: | ||
+ | } | ||
+ | |||
+ | .sun path { | ||
+ | fill: #6baed6; | ||
+ | } | ||
+ | |||
+ | .planet path { | ||
+ | fill: #9ecae1; | ||
+ | } | ||
+ | |||
+ | .annulus path { | ||
+ | fill: #c6dbef; | ||
+ | } | ||
+ | |||
+ | </ | ||
+ | |||
+ | <script src=" | ||
+ | < | ||
+ | |||
+ | var width = 460, | ||
+ | height = 300, | ||
+ | radius = 50, | ||
+ | x = Math.sin(2 * Math.PI / 3), | ||
+ | y = Math.cos(2 * Math.PI / 3); | ||
+ | |||
+ | var offset = 0, | ||
+ | speed = 4, | ||
+ | start = Date.now(); | ||
+ | |||
+ | var svg = d3.select(" | ||
+ | .attr(" | ||
+ | .attr(" | ||
+ | .append(" | ||
+ | .attr(" | ||
+ | .append(" | ||
+ | |||
+ | var frame = svg.append(" | ||
+ | .datum({radius: | ||
+ | |||
+ | frame.append(" | ||
+ | .attr(" | ||
+ | .datum({teeth: | ||
+ | .append(" | ||
+ | .attr(" | ||
+ | |||
+ | frame.append(" | ||
+ | .attr(" | ||
+ | .datum({teeth: | ||
+ | .append(" | ||
+ | .attr(" | ||
+ | |||
+ | frame.append(" | ||
+ | .attr(" | ||
+ | .attr(" | ||
+ | .datum({teeth: | ||
+ | .append(" | ||
+ | .attr(" | ||
+ | |||
+ | frame.append(" | ||
+ | .attr(" | ||
+ | .attr(" | ||
+ | .datum({teeth: | ||
+ | .append(" | ||
+ | .attr(" | ||
+ | |||
+ | frame.append(" | ||
+ | .attr(" | ||
+ | .attr(" | ||
+ | .datum({teeth: | ||
+ | .append(" | ||
+ | .attr(" | ||
+ | |||
+ | d3.selectAll(" | ||
+ | .data([radius * 5, Infinity, -radius]) | ||
+ | .on(" | ||
+ | var radius0 = frame.datum().radius, | ||
+ | frame.datum({radius: | ||
+ | svg.attr(" | ||
+ | }); | ||
+ | |||
+ | d3.selectAll(" | ||
+ | .on(" | ||
+ | |||
+ | function gear(d) { | ||
+ | var n = d.teeth, | ||
+ | r2 = Math.abs(d.radius), | ||
+ | r0 = r2 - 8, | ||
+ | r1 = r2 + 8, | ||
+ | r3 = d.annulus ? (r3 = r0, r0 = r1, r1 = r3, r2 + 20) : 20, | ||
+ | da = Math.PI / n, | ||
+ | a0 = -Math.PI / 2 + (d.annulus ? Math.PI / n : 0), | ||
+ | i = -1, | ||
+ | path = [" | ||
+ | while (++i < n) path.push( | ||
+ | " | ||
+ | " | ||
+ | " | ||
+ | " | ||
+ | " | ||
+ | " | ||
+ | path.push(" | ||
+ | return path.join("" | ||
+ | } | ||
+ | |||
+ | d3.timer(function() { | ||
+ | var angle = (Date.now() - start) * speed, | ||
+ | transform = function(d) { return " | ||
+ | frame.selectAll(" | ||
+ | frame.attr(" | ||
+ | }); | ||
+ | |||
+ | </ | ||
+ | </ | ||
+ | </ | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | ~~TAGCLOUD~~ |