| <html> | |
| <head> | |
| <script src='http://code.jquery.com/jquery-1.5.1.min.js'></script> | |
| </head> | |
| <body> | |
| <h2>Naive canvas</h2> | |
| <canvas id="naive" width="400" height="50"></canvas> | |
| <h2>High-def Canvas</h2> |
| Dial Chart examples. Suggestions and enhancements are welcome. |
| function Gauge(placeholderName, configuration) | |
| { | |
| this.placeholderName = placeholderName; | |
| var self = this; // for internal d3 functions | |
| this.configure = function(configuration) | |
| { | |
| this.config = configuration; | |
| // derived from http://en.wikipedia.org/wiki/Algorithms_for_calculating_variance#Parallel_algorithm | |
| function map() { | |
| emit(1, // Or put a GROUP BY key here | |
| {sum: this.value, // the field you want stats for | |
| min: this.value, | |
| max: this.value, | |
| count:1, | |
| diff: 0, // M2,n: sum((val-mean)^2) | |
| }); |
There are a number of additional dependencies required for getting things installed on OS X. Starting with a blank slate OS X machine, this is the process it takes:
# Install Xcode Command Line Tools
# Install Homebrew
ruby -e "$(curl -fsSkL raw.github.com/mxcl/homebrew/go)"
This is a recreation (for the purpose of tinkering with an implementation in d3.js) of the example from the book SVG Essentials by J. David Eisenberg.
The <feColorMatrix> element allows to change color values in a following way.
| t.prototype.REDACTED = function(a, b, j, c, g) { | |
| for(var r = this.REDACTED2(0), t = Math.tan(r), C = g % 86400 / 86400 * Math.PI * 2, g = [], n = 0;n <= c + 1;n = n + 1) { | |
| g[n] = Math.atan(Math.cos(2 * Math.PI * (j + n / c) / a + C) / t) / Math.PI * c * a / 2 - (b - a / 4) * c; | |
| } | |
| b = Math.max.apply(Math, g); | |
| j = Math.min.apply(Math, g); | |
| a = ""; | |
| if(g[0] > 0 && g[0] < c) { | |
| a = "M0," + g[0]; | |
| if(b >= c) { |
| (function(){ | |
| var db = document.body, //shortcut to document.body | |
| r = 100, //initial radius of the circle | |
| x = (db.clientWidth - r) / 2, //horizontal center | |
| y = (window.pageYOffset || (db.parentNode || db).scrollTop) + ((window.innerHeight+r)/2), //offset from page top | |
| o = 0.0, //angle offset | |
| w = 0, //width of square | |
| dl = 150, //number of divs | |
| ai=Math.PI / dl, //pie slice width | |
| divs=Array.prototype.map.call(new Int8Array(dl),function(){ //div array |
| license: gpl-3.0 | |
| redirect: https://observablehq.com/@mbostock/solar-terminator |
| <?php | |
| /* | |
| * @gist Regex to get youtube video/playlist id with/without time & generate embed code | |
| * @license UNLICENSE (http://unlicense.org) | |
| */ | |
| $youtube_url = array( | |
| "https://youtu.be/yVpbFMhOAwE", | |
| "https://www.youtube.com/embed/yVpbFMhOAwE", |
