Build a custom version of d3.js for my own version of the noise generated line.
This is a demonstration of building a custom D3 4.0 bundle using ES2015 modules and Rollup. Custom bundles can be optimized to contain only the code you need. This example exposes just three fields on the d3
object: d3.event, d3.select and d3.selectAll. The minified and gzipped bundle is only 3,691 bytes, a savings of 93% over the default build!
To build:
npm install
npm run prepublish
You may also run Rollup and UglifyJS directly:
rollup -c && uglifyjs d3.js -c -m -o d3.min.js
export {
event,
select,
selectAll
} from "d3-selection";
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<script src="d3.min.js"></script>
<script>
d3.select("body").append("h1").text("Hello, world!");
</script>
!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n(t.d3=t.d3||{})}(this,function(t){"use strict";function n(t){var n=t+="",e=n.indexOf(":");return e>=0&&"xmlns"!==(n=t.slice(0,e))&&(t=t.slice(e+1)),Ot.hasOwnProperty(n)?{space:Ot[n],local:t}:t}function e(t){return function(){var n=this.ownerDocument,e=this.namespaceURI;return e===Dt&&n.documentElement.namespaceURI===Dt?n.createElement(t):n.createElementNS(e,t)}}function r(t){return function(){return this.ownerDocument.createElementNS(t.space,t.local)}}function i(t){var i=n(t);return(i.local?r:e)(i)}function o(t,n,e){return t=u(t,n,e),function(n){var e=n.relatedTarget;e&&(e===this||8&e.compareDocumentPosition(this))||t.call(this,n)}}function u(n,e,r){return function(i){var o=t.event;t.event=i;try{n.call(this,this.__data__,e,r)}finally{t.event=o}}}function s(t){return t.trim().split(/^|\s+/).map(function(t){var n="",e=t.indexOf(".");return e>=0&&(n=t.slice(e+1),t=t.slice(0,e)),{type:t,name:n}})}function a(t){return function(){var n=this.__on;if(n){for(var e,r=0,i=-1,o=n.length;o>r;++r)e=n[r],t.type&&e.type!==t.type||e.name!==t.name?n[++i]=e:this.removeEventListener(e.type,e.listener,e.capture);++i?n.length=i:delete this.__on}}}function c(t,n,e){var r=It.hasOwnProperty(t.type)?o:u;return function(i,o,u){var s,a=this.__on,c=r(n,o,u);if(a)for(var l=0,f=a.length;f>l;++l)if((s=a[l]).type===t.type&&s.name===t.name)return this.removeEventListener(s.type,s.listener,s.capture),this.addEventListener(s.type,s.listener=c,s.capture=e),void(s.value=n);this.addEventListener(t.type,c,e),s={type:t.type,name:t.name,value:n,listener:c,capture:e},a?a.push(s):this.__on=[s]}}function l(t,n,e){var r,i,o=s(t+""),u=o.length;{if(!(arguments.length<2)){for(l=n?c:a,null==e&&(e=!1),r=0;u>r;++r)this.each(l(o[r],n,e));return this}var l=this.node().__on;if(l)for(var f,h=0,p=l.length;p>h;++h)for(r=0,f=l[h];u>r;++r)if((i=o[r]).type===f.type&&i.name===f.name)return f.value}}function f(t){return function(){return this.querySelector(t)}}function h(t){"function"!=typeof t&&(t=f(t));for(var n=this._groups,e=n.length,r=new Array(e),i=0;e>i;++i)for(var o,u,s=n[i],a=s.length,c=r[i]=new Array(a),l=0;a>l;++l)(o=s[l])&&(u=t.call(o,o.__data__,l,s))&&("__data__"in o&&(u.__data__=o.__data__),c[l]=u);return new Lt(r,this._parents)}function p(t){return function(){return this.querySelectorAll(t)}}function _(t){"function"!=typeof t&&(t=p(t));for(var n=this._groups,e=n.length,r=[],i=[],o=0;e>o;++o)for(var u,s=n[o],a=s.length,c=0;a>c;++c)(u=s[c])&&(r.push(t.call(u,u.__data__,c,s)),i.push(u));return new Lt(r,i)}function d(t){"function"!=typeof t&&(t=Ht(t));for(var n=this._groups,e=n.length,r=new Array(e),i=0;e>i;++i)for(var o,u=n[i],s=u.length,a=r[i]=new Array(s),c=0;s>c;++c)(o=u[c])&&t.call(o,o.__data__,c,u)&&(a[c]=o);return new Lt(r,this._parents)}function v(t){return function(){return t}}function m(t,n,e,r,i,o){for(var u,s=0,a=n.length,c=o.length;c>s;++s)(u=n[s])?(u.__data__=o[s],r[s]=u):e[s]=new w(t,o[s]);for(;a>s;++s)(u=n[s])&&(i[s]=u)}function y(t,n,e,r,i,o,u){var s,a,c,l={},f=n.length,h=o.length,p=new Array(f);for(s=0;f>s;++s)(a=n[s])&&(p[s]=c=Ut+u.call(a,a.__data__,s,n),l[c]||(l[c]=a));for(s=0;h>s;++s)c=Ut+u.call(t,o[s],s,o),(a=l[c])?a!==!0&&(r[s]=a,a.__data__=o[s]):e[s]=new w(t,o[s]),l[c]=!0;for(s=0;f>s;++s)(a=n[s])&&l[p[s]]!==!0&&(i[s]=a)}function g(t,n){if(!t)return p=new Array(this.size()),c=-1,this.each(function(t){p[++c]=t}),p;var e=n?y:m,r=this._parents,i=this._groups;"function"!=typeof t&&(t=v(t));for(var o=i.length,u=new Array(o),s=new Array(o),a=new Array(o),c=0;o>c;++c){var l=r[c],f=i[c],h=f.length,p=t.call(l,l&&l.__data__,c,r),_=p.length,d=s[c]=new Array(_),g=u[c]=new Array(_),w=a[c]=new Array(h);e(l,f,d,g,w,p,n);for(var A,x,S=0,b=0;_>S;++S)if(A=d[S]){for(S>=b&&(b=S+1);!(x=g[b])&&++b<_;);A._next=x||null}}return u=new Lt(u,r),u._enter=s,u._exit=a,u}function w(t,n){this.ownerDocument=t.ownerDocument,this.namespaceURI=t.namespaceURI,this._next=null,this._parent=t,this.__data__=n}function A(t){return new Array(t.length)}function x(){return new Lt(this._enter||this._groups.map(A),this._parents)}function S(){return new Lt(this._exit||this._groups.map(A),this._parents)}function b(t){for(var n=this._groups,e=t._groups,r=n.length,i=e.length,o=Math.min(r,i),u=new Array(r),s=0;o>s;++s)for(var a,c=n[s],l=e[s],f=c.length,h=u[s]=new Array(f),p=0;f>p;++p)(a=c[p]||l[p])&&(h[p]=a);for(;r>s;++s)u[s]=n[s];return new Lt(u,this._parents)}function E(){for(var t=this._groups,n=-1,e=t.length;++n<e;)for(var r,i=t[n],o=i.length-1,u=i[o];--o>=0;)(r=i[o])&&(u&&u!==r.nextSibling&&u.parentNode.insertBefore(r,u),u=r);return this}function N(t){function n(n,e){return n&&e?t(n.__data__,e.__data__):!n-!e}t||(t=C);for(var e=this._groups,r=e.length,i=new Array(r),o=0;r>o;++o){for(var u,s=e[o],a=s.length,c=i[o]=new Array(a),l=0;a>l;++l)(u=s[l])&&(c[l]=u);c.sort(n)}return new Lt(i,this._parents).order()}function C(t,n){return n>t?-1:t>n?1:t>=n?0:NaN}function L(){var t=arguments[0];return arguments[0]=this,t.apply(null,arguments),this}function M(){var t=new Array(this.size()),n=-1;return this.each(function(){t[++n]=this}),t}function q(){for(var t=this._groups,n=0,e=t.length;e>n;++n)for(var r=t[n],i=0,o=r.length;o>i;++i){var u=r[i];if(u)return u}return null}function P(){var t=0;return this.each(function(){++t}),t}function D(){return!this.node()}function O(t){for(var n=this._groups,e=0,r=n.length;r>e;++e)for(var i,o=n[e],u=0,s=o.length;s>u;++u)(i=o[u])&&t.call(i,i.__data__,u,o);return this}function B(t){return function(){this.removeAttribute(t)}}function T(t){return function(){this.removeAttributeNS(t.space,t.local)}}function z(t,n){return function(){this.setAttribute(t,n)}}function H(t,n){return function(){this.setAttributeNS(t.space,t.local,n)}}function I(t,n){return function(){var e=n.apply(this,arguments);null==e?this.removeAttribute(t):this.setAttribute(t,e)}}function R(t,n){return function(){var e=n.apply(this,arguments);null==e?this.removeAttributeNS(t.space,t.local):this.setAttributeNS(t.space,t.local,e)}}function U(t,e){var r=n(t);if(arguments.length<2){var i=this.node();return r.local?i.getAttributeNS(r.space,r.local):i.getAttribute(r)}return this.each((null==e?r.local?T:B:"function"==typeof e?r.local?R:I:r.local?H:z)(r,e))}function j(t){return t.ownerDocument&&t.ownerDocument.defaultView||t.document&&t||t.defaultView}function k(t){return function(){this.style.removeProperty(t)}}function V(t,n,e){return function(){this.style.setProperty(t,n,e)}}function X(t,n,e){return function(){var r=n.apply(this,arguments);null==r?this.style.removeProperty(t):this.style.setProperty(t,r,e)}}function $(t,n,e){var r;return arguments.length>1?this.each((null==n?k:"function"==typeof n?X:V)(t,n,null==e?"":e)):j(r=this.node()).getComputedStyle(r,null).getPropertyValue(t)}function F(t){return function(){delete this[t]}}function G(t,n){return function(){this[t]=n}}function J(t,n){return function(){var e=n.apply(this,arguments);null==e?delete this[t]:this[t]=e}}function K(t,n){return arguments.length>1?this.each((null==n?F:"function"==typeof n?J:G)(t,n)):this.node()[t]}function Q(t){return t.trim().split(/^|\s+/)}function W(t){return t.classList||new Y(t)}function Y(t){this._node=t,this._names=Q(t.getAttribute("class")||"")}function Z(t,n){for(var e=W(t),r=-1,i=n.length;++r<i;)e.add(n[r])}function tt(t,n){for(var e=W(t),r=-1,i=n.length;++r<i;)e.remove(n[r])}function nt(t){return function(){Z(this,t)}}function et(t){return function(){tt(this,t)}}function rt(t,n){return function(){(n.apply(this,arguments)?Z:tt)(this,t)}}function it(t,n){var e=Q(t+"");if(arguments.length<2){for(var r=W(this.node()),i=-1,o=e.length;++i<o;)if(!r.contains(e[i]))return!1;return!0}return this.each(("function"==typeof n?rt:n?nt:et)(e,n))}function ot(){this.textContent=""}function ut(t){return function(){this.textContent=t}}function st(t){return function(){var n=t.apply(this,arguments);this.textContent=null==n?"":n}}function at(t){return arguments.length?this.each(null==t?ot:("function"==typeof t?st:ut)(t)):this.node().textContent}function ct(){this.innerHTML=""}function lt(t){return function(){this.innerHTML=t}}function ft(t){return function(){var n=t.apply(this,arguments);this.innerHTML=null==n?"":n}}function ht(t){return arguments.length?this.each(null==t?ct:("function"==typeof t?ft:lt)(t)):this.node().innerHTML}function pt(){this.nextSibling&&this.parentNode.appendChild(this)}function _t(){return this.each(pt)}function dt(){this.previousSibling&&this.parentNode.insertBefore(this,this.parentNode.firstChild)}function vt(){return this.each(dt)}function mt(t){return function(){return this.appendChild(t.apply(this,arguments))}}function yt(t,n){return function(){return this.insertBefore(t.apply(this,arguments),n.apply(this,arguments)||null)}}function gt(){return null}function wt(t,n){var e="function"==typeof t?t:i(t);return this.select(arguments.length<2?mt(e):yt(e,null==n?gt:"function"==typeof n?n:f(n)))}function At(){var t=this.parentNode;t&&t.removeChild(this)}function xt(){return this.each(At)}function St(t){return arguments.length?this.property("__data__",t):this.node().__data__}function bt(t,n,e){var r=j(t),i=r.CustomEvent;i?i=new i(n,e):(i=r.document.createEvent("Event"),e?(i.initEvent(n,e.bubbles,e.cancelable),i.detail=e.detail):i.initEvent(n,!1,!1)),t.dispatchEvent(i)}function Et(t,n){return function(){return bt(this,t,n)}}function Nt(t,n){return function(){return bt(this,t,n.apply(this,arguments))}}function Ct(t,n){return this.each(("function"==typeof n?Nt:Et)(t,n))}function Lt(t,n){this._groups=t,this._parents=n}function Mt(){return new Lt([[document.documentElement]],jt)}function qt(t){return"string"==typeof t?new Lt([[document.querySelector(t)]],[document.documentElement]):new Lt([[t]],jt)}function Pt(t){return"string"==typeof t?new Lt([document.querySelectorAll(t)],[document.documentElement]):new Lt([t],jt)}var Dt="http://www.w3.org/1999/xhtml",Ot={svg:"http://www.w3.org/2000/svg",xhtml:Dt,xlink:"http://www.w3.org/1999/xlink",xml:"http://www.w3.org/XML/1998/namespace",xmlns:"http://www.w3.org/2000/xmlns/"},Bt=function(t){return function(){return this.matches(t)}};if("undefined"!=typeof document){var Tt=document.documentElement;if(!Tt.matches){var zt=Tt.webkitMatchesSelector||Tt.msMatchesSelector||Tt.mozMatchesSelector||Tt.oMatchesSelector;Bt=function(t){return function(){return zt.call(this,t)}}}}var Ht=Bt,It={};if(t.event=null,"undefined"!=typeof document){var Rt=document.documentElement;"onmouseenter"in Rt||(It={mouseenter:"mouseover",mouseleave:"mouseout"})}var Ut="$";w.prototype={constructor:w,appendChild:function(t){return this._parent.insertBefore(t,this._next)},insertBefore:function(t,n){return this._parent.insertBefore(t,n)},querySelector:function(t){return this._parent.querySelector(t)},querySelectorAll:function(t){return this._parent.querySelectorAll(t)}},Y.prototype={add:function(t){var n=this._names.indexOf(t);0>n&&(this._names.push(t),this._node.setAttribute("class",this._names.join(" ")))},remove:function(t){var n=this._names.indexOf(t);n>=0&&(this._names.splice(n,1),this._node.setAttribute("class",this._names.join(" ")))},contains:function(t){return this._names.indexOf(t)>=0}};var jt=[null];Lt.prototype=Mt.prototype={constructor:Lt,select:h,selectAll:_,filter:d,data:g,enter:x,exit:S,merge:b,order:E,sort:N,call:L,nodes:M,node:q,size:P,empty:D,each:O,attr:U,style:$,property:K,classed:it,text:at,html:ht,raise:_t,lower:vt,append:wt,remove:xt,datum:St,on:l,dispatch:Ct},t.select=qt,t.selectAll=Pt});
{
"name": "d3-custom-example",
"version": "0.0.1",
"scripts": {
"prepublish": "rollup -c && uglifyjs d3.js -c -m -o d3.min.js"
},
"devDependencies": {
"d3-selection": "^0.7.2",
"rollup": "^0.26.3",
"rollup-plugin-node-resolve": "^1.5.0",
"uglify-js": "^2.6.2"
}
}
import npm from "rollup-plugin-node-resolve";
export default {
entry: "index.js",
format: "umd",
moduleName: "d3",
plugins: [npm({jsnext: true})],
dest: "d3.js"
};