Skip to content

Instantly share code, notes, and snippets.

@mbostock
Last active February 9, 2016 01:51
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mbostock/7a8a2de2b99d391add4b to your computer and use it in GitHub Desktop.
Save mbostock/7a8a2de2b99d391add4b to your computer and use it in GitHub Desktop.
Parent Data
license: gpl-3.0

A test of hierarchical selections and parent data, features in development for D3 4.0.

!function t(e,n,r){function i(a,u){if(!n[a]){if(!e[a]){var s="function"==typeof require&&require;if(!u&&s)return s(a,!0);if(o)return o(a,!0);var l=new Error("Cannot find module '"+a+"'");throw l.code="MODULE_NOT_FOUND",l}var c=n[a]={exports:{}};e[a][0].call(c.exports,function(t){var n=e[a][1][t];return i(n?n:t)},c,c.exports,t,e,n,r)}return n[a].exports}for(var o="function"==typeof require&&require,a=0;a<r.length;a++)i(r[a]);return i}({1:[function(t,e,n){(function(e){function r(t,n){var r=t.ownerSVGElement||t;if(r.createSVGPoint){var i=r.createSVGPoint();if(0>a){var u=e.window;if(u.scrollX||u.scrollY){r=o.select("body").append("svg").style({position:"absolute",top:0,left:0,margin:0,padding:0,border:"none"},"important");var s=r.node().getScreenCTM();a=!(s.f||s.e),r.remove()}}return a?(i.x=n.pageX,i.y=n.pageY):(i.x=n.clientX,i.y=n.clientY),i=i.matrixTransform(t.getScreenCTM().inverse()),[i.x,i.y]}var l=t.getBoundingClientRect();return[n.clientX-l.left-t.clientLeft,n.clientY-l.top-t.clientTop]}function i(){for(var t,n=e.d3.event;t=n.sourceEvent;)n=t;return n}var o=t("./selection"),a=e.navigator&&/WebKit/.test(e.navigator.userAgent)?-1:0;n.mouse=function(t,e){return arguments.length<2&&(e=i()),e.changedTouches&&(e=e.changedTouches[0]),r(t,e)},n.touch=function(t,e,n){arguments.length<3&&(n=e,e=i().changedTouches);for(var o,a=0,u=e?e.length:0;u>a;++a)if((o=e[a]).identifier===n)return r(t,o);return null},n.touches=function(t,e){arguments.length<2&&(e=i().touches);for(var n=0,o=e?e.length:0,a=new Array(o);o>n;++n)a[n]=r(t,e[n]);return a}}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./selection":3}],2:[function(t,e,n){var r=n.prefix={svg:"http://www.w3.org/2000/svg",xhtml:"http://www.w3.org/1999/xhtml",xlink:"http://www.w3.org/1999/xlink",xml:"http://www.w3.org/XML/1998/namespace",xmlns:"http://www.w3.org/2000/xmlns/"};n.qualify=function(t){var e=t.indexOf(":"),n=t;return e>=0&&(n=t.slice(0,e),t=t.slice(e+1)),r.hasOwnProperty(n)?{space:r[n],local:t}:t}},{}],3:[function(t,e,n){(function(n){function r(t,e){t._parent=null,this._root=t,this._depth=e}function i(t,e){r.call(this,t,e)}function o(t){this.__data__=t}function a(t){return(t+"").trim().split(/^|\s+/)}function u(){}function s(t){return"function"==typeof t?t:function(){return this.querySelector(t)}}function l(t){return"function"==typeof t?t:function(){return this.querySelectorAll(t)}}function c(t){return"function"==typeof t?t:function(){return this.matches(t)}}function f(t){return"function"==typeof t?t:function(){return t}}function h(t){function e(){var e=this.ownerDocument,n=this.namespaceURI;return n?e.createElementNS(n,t):e.createElement(t)}function n(){return this.ownerDocument.createElementNS(t.space,t.local)}return"function"==typeof t?t:(t=A.qualify(t)).local?n:e}function p(t){return Array.isArray(t)?t:S.call(t)}function _(t){return t&&(t.ownerDocument&&t.ownerDocument.defaultView||t.document&&t||t.defaultView)}function d(t){return new RegExp("(?:^|\\s+)"+w(t)+"(?:\\s+|$)","g")}function g(t){var e=d(t);return function(n,r){if(i=n.classList)return r?i.add(t):i.remove(t);var i=n.getAttribute("class")||"";r?(e.lastIndex=0,e.test(i)||n.setAttribute("class",m(i+" "+t))):n.setAttribute("class",m(i.replace(e," ")))}}function v(t,e){return function(r){var i=n.d3.event;n.d3.event=r,e[0]=this.__data__;try{t.apply(this,e)}finally{n.d3.event=i}}}function y(t,e){var n=v(t,e);return function(t){var e=this,r=t.relatedTarget;r&&(r===e||8&r.compareDocumentPosition(e))||n.call(e,t)}}function m(t){return t.trim().replace(/\s+/g," ")}function w(t){return t.replace(T,"\\$&")}var A=t("./namespace"),b=n.document,x=n.CustomEvent,E=n.Map,S=[].slice,C={mouseenter:"mouseover",mouseleave:"mouseout"},T=/[\\\^\$\*\+\?\|\[\]\(\)\.\{\}]/g;!function(){if(b){for(var t in C)"on"+t in b&&delete C[t];x||(x=function(t,e){var n=b.createEvent("CustomEvent");return e?n.initCustomEvent(t,e.bubbles,e.cancelable,e.detail):n.initCustomEvent(t,!1,!1,void 0),n},x.prototype=n.Event.prototype),E||(E=function(){},E.prototype={set:function(t,e){return this["$"+t]=e,this},get:function(t){return this["$"+t]},has:function(t){return"$"+t in this}})}}(),r.prototype={select:function(t){function e(n,r){var o,a,u=-1,s=n.length,l=new Array(s),c=2*--r,f=c+1;if(r)for(;++u<s;)o=n[u],i[c]=o._parent.__data__,i[f]=u,l[u]=e(o,r);else for(;++u<s;)(o=n[u])&&(i[c]=o.__data__,i[f]=u,(a=t.apply(o,i))&&("__data__"in o&&(a.__data__=o.__data__),l[u]=a));return l._parent=n._parent,l}var n=this._depth,i=new Array(2*n);return t=s(t),new r(e(this._root,n),n)},selectAll:function(t){function e(n,r){var o,a,u=-1,s=n.length,l=new Array(s),c=2*--r,f=c+1;if(r)for(;++u<s;)o=n[u],i[c]=o._parent.__data__,i[f]=u,l[u]=e(o,r);else for(;++u<s;)(o=n[u])&&(i[c]=o.__data__,i[f]=u,l[u]=a=t.apply(o,i),a._parent=o);return l._parent=n._parent,l}var n=this._depth,i=new Array(2*n);return t=l(t),new r(e(this._root,n),n+1)},filter:function(t){function e(n,r){var o,a,u=-1,s=n.length,l=2*--r,c=l+1;if(r)for(a=new Array(s);++u<s;)o=n[u],i[l]=o._parent.__data__,i[c]=u,a[u]=e(o,r);else for(a=[];++u<s;)(o=n[u])&&(i[l]=o.__data__,i[c]=u,t.apply(o,i)&&a.push(o));return a._parent=n._parent,a}var n=this._depth,i=new Array(2*n);return t=c(t),new r(e(this._root,n),n)},data:function(t,e){function n(e,r){if(r)for(var i,o=-1,a=e.length,u=2*--r,s=u+1,f=u+2,p=s+2;++o<a;)i=e[o],l[u]=i._parent.__data__,l[s]=o,c[f]=i._parent.__data__,c[p]=o,n(i,r);else h(e,t.apply(e,l))}function r(t,e){var n,r=0,i=t._enter,a=t._exit,u=t.length,s=e.length,l=Math.min(u,s);for(i.length=0,i.length=s,a.length=0,a.length=u;l>r;++r)(n=t[r])?n.__data__=e[r]:i[r]=new o(e[r]);for(;s>r;++r)i[r]=new o(e[r]);for(;u>r;++r)(n=t[r])&&(a[r]=t[r]);t.length=s}function i(t,n){var r,i,a,u=t._enter,s=t._exit,l=n.length,f=t.length,h=new E,p=new Array(f);for(u.length=0,u.length=l,s.length=0,s.length=f,r=0;f>r;++r)i=t[r],c[0]=i.__data__,c[1]=r,p[r]=a=e.apply(i,c),h.has(a)?(delete t[r],s[r]=i):h.set(a,i);for(t.length=0,t.length=l,r=0;l>r;++r)c[0]=n[r],c[1]=r,a=e.apply(n,c),(i=h.get(a))?i!==!0&&(t[r]=i,i.__data__=n[r]):u[r]=new o(n[r]),h.set(a,!0);for(r=0;f>r;++r)(i=h.get(p[r]))!==!0&&(s[r]=i)}if(!arguments.length){var a=new Array(this.size()),u=-1;return this.each(function(t){a[++u]=t}),a}var s=this._depth-1,l=new Array(2*s),c=new Array(2*s+2),h=e?i:r;return this.enter(),this.exit(),t=f(t),n(this._root,s),this},enter:function(){function t(e,n){var r,i,o=-1,a=e.length,u=new Array(a);if(--n)for(;++o<a;)i=e[o]=p(r=e[o]),i._parent=r._parent,u[o]=t(i,n);else e._enter=u,u._update=e;return u._parent=e._parent,u}if(!this._enter){var e=this._depth;this._enter=new i(t(this._root=p(this._root),e),e)}return this._enter},exit:function(){function t(e,n){var r,i,o=-1,a=e.length,u=new Array(a);if(--n)for(;++o<a;)i=e[o]=p(r=e[o]),i._parent=r._parent,u[o]=t(i,n);else e._exit=u;return u._parent=e._parent,u}if(!this._exit){var e=this._depth;this._exit=new r(t(this._root=p(this._root),e),e)}return this._exit},each:function(t){function e(n,i){var o,a=-1,u=n.length,s=2*--i,l=s+1;if(i)for(;++a<u;)o=n[a],r[s]=o._parent.__data__,r[l]=a,e(o,i);else for(;++a<u;)(o=n[a])&&(r[s]=o.__data__,r[l]=a,t.apply(o,r))}var n=this._depth,r=new Array(n);return e(this._root,n),this},attr:function(t,e){function n(){this.removeAttribute(t)}function r(){this.removeAttributeNS(t.space,t.local)}function i(){this.setAttribute(t,e)}function o(){this.setAttributeNS(t.space,t.local,e)}function a(){var n=e.apply(this,arguments);null==n?this.removeAttribute(t):this.setAttribute(t,n)}function u(){var n=e.apply(this,arguments);null==n?this.removeAttributeNS(t.space,t.local):this.setAttributeNS(t.space,t.local,n)}if(t=A.qualify(t),arguments.length<2){var s=this.node();return t.local?s.getAttributeNS(t.space,t.local):s.getAttribute(t)}return this.each(null==e?t.local?r:n:"function"==typeof e?t.local?u:a:t.local?o:i)},style:function(t,e,n){function r(){this.style.removeProperty(t)}function i(){this.style.setProperty(t,e,n)}function o(){var r=e.apply(this,arguments);null==r?this.style.removeProperty(t):this.style.setProperty(t,r,n)}var a=arguments.length;return 2>a?_(a=this.node()).getComputedStyle(a,null).getPropertyValue(t):(3>a&&(n=""),this.each(null==e?r:"function"==typeof e?o:i))},property:function(t,e){function n(){delete this[t]}function r(){this[t]=e}function i(){var n=e.apply(this,arguments);null==n?delete this[t]:this[t]=n}return arguments.length<2?this.node()[t]:this.each(null==e?n:"function"==typeof e?i:r)},"class":function(t,e){function n(){for(var n=-1;++n<i;)t[n](this,e)}function r(){for(var n=-1,r=e.apply(this,arguments);++n<i;)t[n](this,r)}t=a(t);var i=t.length;if(arguments.length<2){var o=this.node(),u=-1;if(e=o.classList){for(;++u<i;)if(!e.contains(t[u]))return!1}else for(e=o.getAttribute("class");++u<i;)if(!classedRe(t[u]).test(e))return!1;return!0}return t=t.map(g),this.each("function"==typeof e?r:n)},text:function(t){function e(){this.textContent=t}function n(){var e=t.apply(this,arguments);this.textContent=null==e?"":e}return arguments.length?(null==t&&(t=""),this.each("function"==typeof t?n:e)):this.node().textContent},html:function(t){function e(){this.innerHTML=t}function n(){var e=t.apply(this,arguments);this.innerHTML=null==e?"":e}return arguments.length?(null==t&&(t=""),this.each("function"==typeof t?n:e)):this.node().innerHTML},append:function(t){return t=h(t),this.select(function(){return this.appendChild(t.apply(this,arguments))})},insert:function(t,e){return t=h(t),e=s(e),this.select(function(){return this.insertBefore(t.apply(this,arguments),e.apply(this,arguments)||null)})},remove:function(){return this.each(function(){var t=this.parentNode;t&&t.removeChild(this)})},datum:function(t){return arguments.length?this.property("__data__",t):this.node().__data__},event:function(t,e,n){function r(){var r=l(e,S.call(arguments));i.call(this),this.addEventListener(t,this[s]=r,r.$=n),r._=e}function i(){var e=this[s];e&&(this.removeEventListener(t,e,e.$),delete this[s])}function o(){var e,n=new RegExp("^__on([^.]+)"+w(t)+"$");for(var r in this)if(e=r.match(n)){var i=this[r];this.removeEventListener(e[1],i,i.$),delete this[r]}}var a=arguments.length,s="__on"+t,l=v;return 2>a?(a=this.node()[s])&&a._:(3>a&&(n=!1),(a=t.indexOf("."))>0&&(t=t.slice(0,a)),C.hasOwnProperty(t)&&(l=y,t=C[t]),this.each(e?a?r:u:a?i:o))},dispatch:function(t,e){function n(){return this.dispatchEvent(new x(t,e))}function r(){return this.dispatchEvent(new x(t,e.apply(this,arguments)))}return this.each("function"==typeof e?r:n)},call:function(t){var e=S.call(arguments);return t.apply(e[0]=this,e),this},empty:function(){return!this.node()},nodes:function(){var t=new Array(this.size()),e=-1;return this.each(function(){t[++e]=this}),t},node:function(){function t(e,n){var r,i=-1,o=e.length;if(--n){for(;++i<o;)if(r=t(e[i],n))return r}else for(;++i<o;)if(r=e[i])return r}return t(this._root,this._depth)},size:function(){var t=0;return this.each(function(){++t}),t}},r.select=function(t){return new r(["string"==typeof t?b.querySelector(t):t],1)},r.selectAll=function(t){return new r("string"==typeof t?b.querySelectorAll(t):t,1)},i.prototype=Object.create(r.prototype),i.prototype.select=function(t){function e(n,r){var o,a,u=-1,s=n.length,l=new Array(s),c=2*--r,f=c+1;if(r)for(;++u<s;)o=n[u],i[c]=o._parent.__data__,i[f]=u,l[u]=e(o,r);else for(;++u<s;)(o=n[u])&&(i[c]=o.__data__,i[f]=u,(a=t.apply(n._parent,i))&&("__data__"in o&&(a.__data__=o.__data__),l[u]=n._update[u]=a));return l._parent=n._parent,l}var n=this._depth,i=new Array(2*n);return t=s(t),new r(e(this._root,n),n)},e.exports=r}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./namespace":2}],4:[function(t,e,n){(function(e){var n=t("./lib/d3/event"),r=t("./lib/d3/namespace"),i=t("./lib/d3/selection"),o=e.d3||(e.d3={});o.mouse=n.mouse,o.touch=n.touch,o.touches=n.touches,o.namespace=r.prefix,o.selection=i,o.select=i.select,o.selectAll=i.selectAll,o.ns=r,i.prototype.on=i.prototype.event,i.prototype.classed=i.prototype["class"]}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./lib/d3/event":1,"./lib/d3/namespace":2,"./lib/d3/selection":3}]},{},[4]);
<!DOCTYPE html>
<meta charset="utf-8">
<style>
td {
border: solid 1px #ccc;
padding: 10px;
}
table {
margin: 10px;
border-spacing: 0;
border-collapse: collapse;
}
</style>
<body>
<script src="d3-selection.min.js"></script>
<script>
d3.select("body")
.append("table")
.selectAll("tr")
.data(["y" + 0, "y" + 1, "y" + 2])
.enter().append("tr")
.selectAll("td")
.data(["x" + 0, "x" + 1, "x" + 2])
.enter().append("td")
.text(function(x, i, y, j) { return [x, y]; });
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment