[ Launch: Changing string lengths. ] 6758098 by dwskau
[ Launch: Data workshop responsive layout ] 6757864 by dwskau
[ Launch: Data workshop responsive layout ] 6757863 by dwskau
[ Launch: Responsive svg layout ] 6745386 by roundrobin
[ Launch: Responsive svg layout ] 6745287 by roundrobin
[ Launch: Tributary inlet ] 6509693 by roundrobin
-
-
Save dwskau/6758098 to your computer and use it in GitHub Desktop.
Changing string lengths.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| {"description":"Changing string lengths.","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"test.json":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"pingpong","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"thumbnail":"http://i.imgur.com/fk1ABrj.png"} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var data = tributary.test; | |
| var nrOfEls = data.length/2; | |
| var columns = 2; | |
| var width = 632; | |
| var height = 214; | |
| var coffeeType = "mokka-lbs"; | |
| var chartGroup = g.append("g") | |
| .attr({ | |
| transform: "translate("+[83,84]+")", | |
| "class": "group" | |
| }); | |
| var backgroundRect = chartGroup.append("rect") | |
| .attr({ | |
| width: width, | |
| height: height, | |
| fill: "#A8A8A8" | |
| }); | |
| var totalRange = d3.range(nrOfEls); | |
| var range = d3.range(Math.ceil(nrOfEls / columns)); | |
| var heightScale = d3.scale.ordinal().domain(range).rangeBands([0, height], 0.1); | |
| var widthScale = d3.scale.ordinal().domain(d3.range(columns)).rangeBands([0, width], 0.1); | |
| var color = "#133E8C"; | |
| var strokeColor = "#C88100"; | |
| var strokeWidth = 1; | |
| var fontColor = "#C68200"; | |
| var xIndex = 0; | |
| var yIndex = 0; | |
| var yIndexHelper = 0; | |
| var ySum = 0; | |
| var radius = Math.min(heightScale.rangeBand()/2, widthScale.rangeBand()/2); | |
| var selection = chartGroup.selectAll('.circleGroups') | |
| .data(data) | |
| .enter(); | |
| var x = 0; | |
| var y = 0; | |
| var rectGroup = selection.append("g") | |
| .attr({ | |
| transform: function(d,i){ | |
| if(xIndex % columns === 0){ | |
| xIndex = 0; | |
| } | |
| xIndex++; | |
| if(yIndexHelper % columns === 0){ | |
| yIndex++; | |
| yIndexHelper = 0; | |
| } | |
| yIndexHelper++; | |
| y = heightScale(yIndex-1); | |
| x = widthScale(xIndex-1); | |
| return "translate("+[x, y]+")"; | |
| }, | |
| "class": "zickzack-group" | |
| }); | |
| rectGroup.append("rect") | |
| .attr({ | |
| width: widthScale.rangeBand(), | |
| height: heightScale.rangeBand(), | |
| fill: "#C5C5C5" | |
| }); | |
| rectGroup.append("circle") | |
| .attr({ | |
| r: function(d,i){return d[coffeeType];}, | |
| cx: radius, | |
| cy: radius, | |
| fill: color, | |
| stroke: strokeColor, | |
| "stroke-width" : strokeWidth | |
| }); | |
| var texts = rectGroup.append('text') | |
| .text(function(d,i){ | |
| return d.date+" Level: "+d[coffeeType]; | |
| }) | |
| .attr({ | |
| fill: "#000000", | |
| x : radius *2.2, | |
| y: heightScale.rangeBand()*0.7, | |
| "font-size": heightScale.rangeBand()*0.4 | |
| }); | |
| texts.each(function(){ | |
| var el = d3.select(this); | |
| fitTextToBox((widthScale.rangeBand()-(radius*2))*0.8,heightScale.rangeBand()*0.5,el); | |
| }); | |
| function fitTextToBox(boxWidth, boxHeight, text){ | |
| var textWidth = text.node().getComputedTextLength(); | |
| var textHeight = text.node().getBBox().height; | |
| var currentFS = 0; | |
| if(!text.attr("font-size")){ | |
| console.log("fitTextToBox: No Font-size set"); | |
| } else { | |
| currentFS = text.attr("font-size"); | |
| } | |
| var maxWidth = (boxWidth / textWidth ); | |
| var maxHeight = (boxHeight /textHeight); | |
| var max = Math.min(maxWidth, maxHeight); | |
| var fontsize = (currentFS * max); | |
| text.attr("font-size", fontsize) | |
| return text; | |
| } | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| [{ | |
| "date":"1/1/2012", | |
| "mokka-lb":"8.12", | |
| "mokka-lbs":"27", | |
| "arusha-lb":"9.18", | |
| "arusha-lbs":"23", | |
| "ethiopianyirgacheffe-lb":"8.32", | |
| "ethiopianyirgacheffe-lbs":"28", | |
| "k7-lb":"5.86", | |
| "k7-lbs":"12", | |
| "pacas-lb":"6.41", | |
| "pacas-lbs":"23", | |
| "uganda-lb":"5.56", | |
| "uganda-lbs":"18", | |
| "rowNumber":1 | |
| }, | |
| { | |
| "date":"2/1/2012", | |
| "mokka-lb":"9.08", | |
| "mokka-lbs":"23", | |
| "arusha-lb":"10.69", | |
| "arusha-lbs":"16", | |
| "ethiopianyirgacheffe-lb":"9.67", | |
| "ethiopianyirgacheffe-lbs":"19", | |
| "k7-lb":"6.6", | |
| "k7-lbs":"22", | |
| "pacas-lb":"6", | |
| "pacas-lbs":"17", | |
| "uganda-lb":"3.71", | |
| "uganda-lbs":"9", | |
| "rowNumber":2 | |
| }, | |
| { | |
| "date":"3/1/2012", | |
| "mokka-lb":"9.66", | |
| "mokka-lbs":"28", | |
| "arusha-lb":"11.68", | |
| "arusha-lbs":"22", | |
| "ethiopianyirgacheffe-lb":"10.72", | |
| "ethiopianyirgacheffe-lbs":"17", | |
| "k7-lb":"7.71", | |
| "k7-lbs":"31", | |
| "pacas-lb":"7.21", | |
| "pacas-lbs":"13", | |
| "uganda-lb":"2.52", | |
| "uganda-lbs":"0", | |
| "rowNumber":3 | |
| }, | |
| { | |
| "date":"4/1/2012", | |
| "mokka-lb":"9.59", | |
| "mokka-lbs":"35", | |
| "arusha-lb":"11.99", | |
| "arusha-lbs":"30", | |
| "ethiopianyirgacheffe-lb":"11.72", | |
| "ethiopianyirgacheffe-lbs":"15", | |
| "k7-lb":"8.47", | |
| "k7-lbs":"31", | |
| "pacas-lb":"8.07", | |
| "pacas-lbs":"20", | |
| "uganda-lb":"4.52", | |
| "uganda-lbs":"5", | |
| "rowNumber":4 | |
| }, | |
| { | |
| "date":"5/1/2012", | |
| "mokka-lb":"7.69", | |
| "mokka-lbs":"42", | |
| "arusha-lb":"10.83", | |
| "arusha-lbs":"38", | |
| "ethiopianyirgacheffe-lb":"10.47", | |
| "ethiopianyirgacheffe-lbs":"23", | |
| "k7-lb":"6.88", | |
| "k7-lbs":"38", | |
| "pacas-lb":"6.81", | |
| "pacas-lbs":"20", | |
| "uganda-lb":"4.43", | |
| "uganda-lbs":"1", | |
| "rowNumber":5 | |
| }, | |
| { | |
| "date":"6/1/2012", | |
| "mokka-lb":"9.41", | |
| "mokka-lbs":"34", | |
| "arusha-lb":"11.57", | |
| "arusha-lbs":"29", | |
| "ethiopianyirgacheffe-lb":"12.28", | |
| "ethiopianyirgacheffe-lbs":"16", | |
| "k7-lb":"7.09", | |
| "k7-lbs":"44", | |
| "pacas-lb":"6.42", | |
| "pacas-lbs":"21", | |
| "uganda-lb":"5.21", | |
| "uganda-lbs":"5", | |
| "rowNumber":6 | |
| }, | |
| { | |
| "date":"7/1/2012", | |
| "mokka-lb":"10.81", | |
| "mokka-lbs":"26", | |
| "arusha-lb":"13.14", | |
| "arusha-lbs":"24", | |
| "ethiopianyirgacheffe-lb":"11.36", | |
| "ethiopianyirgacheffe-lbs":"11", | |
| "k7-lb":"7.75", | |
| "k7-lbs":"34", | |
| "pacas-lb":"7.71", | |
| "pacas-lbs":"17", | |
| "uganda-lb":"7.18", | |
| "uganda-lbs":"7", | |
| "rowNumber":7 | |
| }, | |
| { | |
| "date":"8/1/2012", | |
| "mokka-lb":"9.61", | |
| "mokka-lbs":"36", | |
| "arusha-lb":"14.11", | |
| "arusha-lbs":"31", | |
| "ethiopianyirgacheffe-lb":"11.03", | |
| "ethiopianyirgacheffe-lbs":"18", | |
| "k7-lb":"6.82", | |
| "k7-lbs":"33", | |
| "pacas-lb":"6.45", | |
| "pacas-lbs":"8", | |
| "uganda-lb":"6.81", | |
| "uganda-lbs":"13", | |
| "rowNumber":8 | |
| }, | |
| { | |
| "date":"9/1/2012", | |
| "mokka-lb":"10.13", | |
| "mokka-lbs":"33", | |
| "arusha-lb":"12.41", | |
| "arusha-lbs":"23", | |
| "ethiopianyirgacheffe-lb":"9.8", | |
| "ethiopianyirgacheffe-lbs":"23", | |
| "k7-lb":"5.38", | |
| "k7-lbs":"23", | |
| "pacas-lb":"5.27", | |
| "pacas-lbs":"1", | |
| "uganda-lb":"7.13", | |
| "uganda-lbs":"9", | |
| "rowNumber":9 | |
| }, | |
| { | |
| "date":"10/1/2012", | |
| "mokka-lb":"9.56", | |
| "mokka-lbs":"42", | |
| "arusha-lb":"12.95", | |
| "arusha-lbs":"28", | |
| "ethiopianyirgacheffe-lb":"10.01", | |
| "ethiopianyirgacheffe-lbs":"26", | |
| "k7-lb":"3.9", | |
| "k7-lbs":"21", | |
| "pacas-lb":"5.51", | |
| "pacas-lbs":"6", | |
| "uganda-lb":"5.3", | |
| "uganda-lbs":"18", | |
| "rowNumber":10 | |
| }, | |
| { | |
| "date":"11/1/2012", | |
| "mokka-lb":"7.56", | |
| "mokka-lbs":"41", | |
| "arusha-lb":"12.76", | |
| "arusha-lbs":"34", | |
| "ethiopianyirgacheffe-lb":"9.9", | |
| "ethiopianyirgacheffe-lbs":"26", | |
| "k7-lb":"5.13", | |
| "k7-lbs":"28", | |
| "pacas-lb":"4.15", | |
| "pacas-lbs":"10", | |
| "uganda-lb":"4.23", | |
| "uganda-lbs":"14", | |
| "rowNumber":11 | |
| }, | |
| { | |
| "date":"12/1/2012", | |
| "mokka-lb":"6.72", | |
| "mokka-lbs":"34", | |
| "arusha-lb":"14.35", | |
| "arusha-lbs":"42", | |
| "ethiopianyirgacheffe-lb":"8.32", | |
| "ethiopianyirgacheffe-lbs":"27", | |
| "k7-lb":"3.96", | |
| "k7-lbs":"32", | |
| "pacas-lb":"2.36", | |
| "pacas-lbs":"4", | |
| "uganda-lb":"4.83", | |
| "uganda-lbs":"20", | |
| "rowNumber":12 | |
| }, | |
| { | |
| "date":"1/1/2013", | |
| "mokka-lb":"5.74", | |
| "mokka-lbs":"36", | |
| "arusha-lb":"13.58", | |
| "arusha-lbs":"39", | |
| "ethiopianyirgacheffe-lb":"7.01", | |
| "ethiopianyirgacheffe-lbs":"17", | |
| "k7-lb":"2.85", | |
| "k7-lbs":"38", | |
| "pacas-lb":"2.97", | |
| "pacas-lbs":"0", | |
| "uganda-lb":"4.44", | |
| "uganda-lbs":"10", | |
| "rowNumber":13 | |
| }, | |
| { | |
| "date":"2/1/2013", | |
| "mokka-lb":"6.28", | |
| "mokka-lbs":"27", | |
| "arusha-lb":"14.99", | |
| "arusha-lbs":"33", | |
| "ethiopianyirgacheffe-lb":"5.53", | |
| "ethiopianyirgacheffe-lbs":"23", | |
| "k7-lb":"0.970000000000001", | |
| "k7-lbs":"37", | |
| "pacas-lb":"3.8", | |
| "pacas-lbs":"8", | |
| "uganda-lb":"6.19", | |
| "uganda-lbs":"11", | |
| "rowNumber":14 | |
| }, | |
| { | |
| "date":"3/1/2013", | |
| "mokka-lb":"6", | |
| "mokka-lbs":"37", | |
| "arusha-lb":"16.73", | |
| "arusha-lbs":"31", | |
| "ethiopianyirgacheffe-lb":"3.9", | |
| "ethiopianyirgacheffe-lbs":"25", | |
| "k7-lb":"0.829999999999999", | |
| "k7-lbs":"34", | |
| "pacas-lb":"2.09", | |
| "pacas-lbs":"1", | |
| "uganda-lb":"4.54", | |
| "uganda-lbs":"1", | |
| "rowNumber":15 | |
| }, | |
| { | |
| "date":"4/1/2013", | |
| "mokka-lb":"4.96", | |
| "mokka-lbs":"39", | |
| "arusha-lb":"16.22", | |
| "arusha-lbs":"26", | |
| "ethiopianyirgacheffe-lb":"4.29", | |
| "ethiopianyirgacheffe-lbs":"21", | |
| "k7-lb":"0.449999999999999", | |
| "k7-lbs":"30", | |
| "pacas-lb":"2.47", | |
| "pacas-lbs":"2", | |
| "uganda-lb":"2.68", | |
| "uganda-lbs":"5", | |
| "rowNumber":16 | |
| }, | |
| { | |
| "date":"5/1/2013", | |
| "mokka-lb":"6.46", | |
| "mokka-lbs":"49", | |
| "arusha-lb":"15.58", | |
| "arusha-lbs":"33", | |
| "ethiopianyirgacheffe-lb":"2.55", | |
| "ethiopianyirgacheffe-lbs":"19", | |
| "k7-lb":"0.150000000000001", | |
| "k7-lbs":"30", | |
| "pacas-lb":"3.63", | |
| "pacas-lbs":"8", | |
| "uganda-lb":"3.03", | |
| "uganda-lbs":"14", | |
| "rowNumber":17 | |
| }, | |
| { | |
| "date":"6/1/2013", | |
| "mokka-lb":"6.09", | |
| "mokka-lbs":"49", | |
| "arusha-lb":"15.44", | |
| "arusha-lbs":"35", | |
| "ethiopianyirgacheffe-lb":"3.52", | |
| "ethiopianyirgacheffe-lbs":"18", | |
| "k7-lb":"1.36", | |
| "k7-lbs":"21", | |
| "pacas-lb":"3.93", | |
| "pacas-lbs":"17", | |
| "uganda-lb":"4.5", | |
| "uganda-lbs":"14", | |
| "rowNumber":18 | |
| }, | |
| { | |
| "date":"7/1/2013", | |
| "mokka-lb":"4.16", | |
| "mokka-lbs":"51", | |
| "arusha-lb":"14.48", | |
| "arusha-lbs":"37", | |
| "ethiopianyirgacheffe-lb":"2.63", | |
| "ethiopianyirgacheffe-lbs":"27", | |
| "k7-lb":"0.410000000000001", | |
| "k7-lbs":"18", | |
| "pacas-lb":"4.39", | |
| "pacas-lbs":"9", | |
| "uganda-lb":"3.49", | |
| "uganda-lbs":"15", | |
| "rowNumber":19 | |
| }, | |
| { | |
| "date":"8/1/2013", | |
| "mokka-lb":"2.37", | |
| "mokka-lbs":"47", | |
| "arusha-lb":"13.32", | |
| "arusha-lbs":"31", | |
| "ethiopianyirgacheffe-lb":"1.65", | |
| "ethiopianyirgacheffe-lbs":"34", | |
| "k7-lb":"1.02", | |
| "k7-lbs":"14", | |
| "pacas-lb":"4.78", | |
| "pacas-lbs":"16", | |
| "uganda-lb":"3.27", | |
| "uganda-lbs":"21", | |
| "rowNumber":20 | |
| }, | |
| { | |
| "date":"9/1/2013", | |
| "mokka-lb":"4.15", | |
| "mokka-lbs":"54", | |
| "arusha-lb":"13", | |
| "arusha-lbs":"34", | |
| "ethiopianyirgacheffe-lb":"3.41", | |
| "ethiopianyirgacheffe-lbs":"37", | |
| "k7-lb":"1.35", | |
| "k7-lbs":"18", | |
| "pacas-lb":"3.18", | |
| "pacas-lbs":"6", | |
| "uganda-lb":"4.11", | |
| "uganda-lbs":"17", | |
| "rowNumber":21 | |
| }, | |
| { | |
| "date":"10/1/2013", | |
| "mokka-lb":"2.65", | |
| "mokka-lbs":"54", | |
| "arusha-lb":"14.04", | |
| "arusha-lbs":"33", | |
| "ethiopianyirgacheffe-lb":"3.46", | |
| "ethiopianyirgacheffe-lbs":"47", | |
| "k7-lb":"2.56", | |
| "k7-lbs":"26", | |
| "pacas-lb":"4.34", | |
| "pacas-lbs":"4", | |
| "uganda-lb":"4", | |
| "uganda-lbs":"18", | |
| "rowNumber":22 | |
| }, | |
| { | |
| "date":"11/1/2013", | |
| "mokka-lb":"2.74", | |
| "mokka-lbs":"56", | |
| "arusha-lb":"13.15", | |
| "arusha-lbs":"39", | |
| "ethiopianyirgacheffe-lb":"4.68", | |
| "ethiopianyirgacheffe-lbs":"47", | |
| "k7-lb":"2.77", | |
| "k7-lbs":"29", | |
| "pacas-lb":"4.83", | |
| "pacas-lbs":"3", | |
| "uganda-lb":"4.31", | |
| "uganda-lbs":"22", | |
| "rowNumber":23 | |
| }, | |
| { | |
| "date":"12/1/2013", | |
| "mokka-lb":"2.71", | |
| "mokka-lbs":"50", | |
| "arusha-lb":"14.01", | |
| "arusha-lbs":"37", | |
| "ethiopianyirgacheffe-lb":"4.89", | |
| "ethiopianyirgacheffe-lbs":"49", | |
| "k7-lb":"1.28", | |
| "k7-lbs":"26", | |
| "pacas-lb":"5.91", | |
| "pacas-lbs":"12", | |
| "uganda-lb":"4.97", | |
| "uganda-lbs":"15", | |
| "rowNumber":24 | |
| }] |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment