cl-react-graph
Version:
2 lines • 16.5 kB
JavaScript
(window.webpackJsonp=window.webpackJsonp||[]).push([[8],{265:function(t,e,a){"use strict";a.r(e);a(53);var n=a(0),r=a.n(n),i=a(285),s=a(324),o=a(307),c=a(304),l=a(348),u=Object.assign({},l.b,{counts:[Object.assign({},l.b.counts[0],{data:[7,6,5,4,3,2,1],label:"Data 2"})],title:"Plot 2"});e.default=function(){return r.a.createElement(o.a,null,r.a.createElement(c.a,{title:"Joy Plot",description:""}),r.a.createElement(i.n,{variant:"h2"},"Joy Plot"),r.a.createElement("div",null,r.a.createElement(i.g,{container:!0,spacing:24},r.a.createElement(i.g,{item:!0,xs:6},r.a.createElement(i.c,null,r.a.createElement(i.d,null,r.a.createElement(s.a,{data:[l.b,u],colorScheme:["rgba(0, 0, 0, 0.5)","#666"],width:400,height:400})))))))}},272:function(t,e,a){"use strict";a.d(e,"c",function(){return r}),a.d(e,"a",function(){return i}),a.d(e,"b",function(){return s});a(53);var n=a(306),r={fill:"#000",opacity:1,"shape-rendering":"auto",stroke:"#000","stroke-opacity":1,"stroke-width":1,visible:!0},i=(n.e,{x:{dateFormat:"",height:20,label:"",margin:20,numberFormat:"",scale:"LINEAR",style:Object.assign({},r,{fill:"none",stroke:"#666"}),text:{style:{dy:".35em",transform:"rotate(0)",x:0,y:10}},tickSize:0,ticks:3,visible:!0,width:50},y:{dateFormat:"",height:20,label:"",margin:20,numberFormat:"",scale:"LINEAR",style:Object.assign({},r,{fill:"none",stroke:"#666"}),text:{style:{fill:"#666"}},tickSize:20,ticks:3,visible:!0,width:50}}),s={x:{height:1,style:Object.assign({},r,{fill:"none",stroke:"#bbb","stroke-opacity":.7,"stroke-width":1}),ticks:5,visible:!0},y:{style:Object.assign({},r,{fill:"none",stroke:"#bbb","stroke-opacity":.7,"stroke-width":1}),ticks:5,visible:!0}}},283:function(t,e,a){"use strict";e.a=["#4bbcad","#d54539","#5ab94d","#8a5cd3","#a4b243","#ba5ccd","#54995c","#cf47a1","#d29f3e","#5c6fda","#c36528","#5fa6dc","#d74770","#7d7430","#8a529e","#df9273","#5f74b8","#ac5450","#d192d7","#b26088"]},288:function(t,e,a){"use strict";a(83),a(407),a(128);e.a=function(t,e){return Object.keys(e).forEach(function(a){t.attr(a,e[a])}),t}},289:function(t,e,a){"use strict";a.d(e,"b",function(){return r});var n=a(273);e.a={fx:{in:function(t){t.style("left",n.a.pageX+"px").style("top",n.a.pageY-55+"px"),t.transition().duration(200).style("opacity",.9)},move:function(t){t.style("left",n.a.pageX+"px").style("top",n.a.pageY-55+"px")},out:function(t){t.transition().duration(100).style("opacity",0)}}};var r=function(t,e){return e&&e.remove(),(e=Object(n.d)(t).append("div").attr("class","tooltip top").style("opacity",0)).append("div").attr("class","tooltip-arrow"),{tipContainer:e,tipContent:e.append("div").attr("class","tooltip-inner")}}},293:function(t,e,a){"use strict";a.d(e,"b",function(){return u});var n=a(0),r=a.n(n),i=a(1),s=a.n(i),o=a(54),c=a.n(o);a.d(e,"a",function(){return c.a});a(296);var l=r.a.createContext({}),u=function(t){return r.a.createElement(l.Consumer,null,function(e){return t.data||e[t.query]&&e[t.query].data?(t.render||t.children)(t.data?t.data.data:e[t.query].data):r.a.createElement("div",null,"Loading (StaticQuery)")})};u.propTypes={data:s.a.object,query:s.a.string.isRequired,render:s.a.func,children:s.a.func}},296:function(t,e,a){var n;t.exports=(n=a(320))&&n.default||n},298:function(t,e,a){"use strict";a(352);var n=a(420),r=a.n(n);e.a=function(t){return t.filter(function(t){try{var e=r()(t),a=e.hsl().array();if(a.length>3)return!1;var n=e.luminosity();return n<.8&&n>.1&&a[2]<200&&a[2]>20}catch(i){return!1}}).filter(function(t,e,a){return a.indexOf(t)===e}).sort(function(){return Math.random()-.5})}},304:function(t,e,a){"use strict";var n=a(322),r=a(1),i=a.n(r),s=a(0),o=a.n(s),c=a(397),l=a.n(c);function u(t){var e=t.description,a=t.lang,r=t.meta,i=t.keywords,s=t.title,c=n.data.site,u=e||c.siteMetadata.description;return o.a.createElement(l.a,{htmlAttributes:{lang:a},title:s,titleTemplate:"%s | "+c.siteMetadata.title,meta:[{content:u,name:"description"},{content:s,property:"og:title"},{content:u,property:"og:description"},{content:"website",property:"og:type"},{content:"summary",name:"twitter:card"},{content:c.siteMetadata.author,name:"twitter:creator"},{content:s,name:"twitter:title"},{content:u,name:"twitter:description"}].concat(i.length>0?{content:i.join(", "),name:"keywords"}:[]).concat(r)})}u.defaultProps={keywords:[],lang:"en",meta:[]},u.propTypes={description:i.a.string,keywords:i.a.arrayOf(i.a.string),lang:i.a.string,meta:i.a.array,title:i.a.string.isRequired},e.a=u},307:function(t,e,a){"use strict";var n=a(319),r=(a(396),a(293)),i=a(1),s=a.n(i),o=a(0),c=a.n(o),l=a(285),u=function(t){var e=t.siteTitle;return c.a.createElement(l.a,{position:"static"},c.a.createElement(l.m,null,c.a.createElement(l.n,{variant:"h6",color:"inherit"},c.a.createElement(r.a,{to:"/"},e)),c.a.createElement(l.b,null,c.a.createElement(r.a,{to:"histogram"},"Histogram")),c.a.createElement(l.b,null,c.a.createElement(r.a,{to:"line"},"Line Chart")),c.a.createElement(l.b,null,c.a.createElement(r.a,{to:"pie"},"Pie Chart")),c.a.createElement(l.b,null,c.a.createElement(r.a,{to:"joyplot"},"Joy Plot"))))};u.propTypes={siteTitle:s.a.string},u.defaultProps={siteTitle:""};var d=u,f=function(t){var e=t.children;return c.a.createElement(r.b,{query:"755544856",render:function(t){return c.a.createElement(c.a.Fragment,null,c.a.createElement(d,{siteTitle:t.site.siteMetadata.title}),c.a.createElement("div",{style:{flexGrow:2,margin:"0 auto",padding:"0px 1.0875rem 1.45rem",paddingTop:0,width:"100%"}},c.a.createElement("main",null,e)),c.a.createElement("footer",null,"© ",(new Date).getFullYear(),", Built by"," ",c.a.createElement("a",{href:"https://www.infosum.com"},"InfoSum")))},data:n})};f.propTypes={children:s.a.node.isRequired};e.a=f},319:function(t){t.exports={data:{site:{siteMetadata:{title:"Infosum Charts"}}}}},320:function(t,e,a){"use strict";a.r(e);a(53);var n=a(0),r=a.n(n),i=a(1),s=a.n(i),o=a(85),c=a(4),l=function(t){var e=t.location,a=c.default.getResourcesForPathnameSync(e.pathname);return r.a.createElement(o.a,Object.assign({location:e,pageResources:a},a.json))};l.propTypes={location:s.a.shape({pathname:s.a.string.isRequired}).isRequired},e.default=l},322:function(t){t.exports={data:{site:{siteMetadata:{title:"Infosum Charts",description:"Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.",author:"@gatsbyjs"}}}}},324:function(t,e,a){"use strict";a(53);var n=a(82),r=a.n(n),i=a(10),s=a.n(i),o=a(0),c=a.n(o),l=a(55),u=a.n(l),d=(a(323),a(128),a(83),a(418),a(130),a(419),a(279),a(295)),f=a(290),h=a(284),m=a(273),p=a(294),b=a.n(p),g=a(287),y=a.n(g),v=a(283),x=a(288),k=a(289),w=a(272),O=function(){var t,e,a,n,r,i,s,o,c,l=Object(h.a)(),u=Object(h.b)(),p=Object(h.a)(),g=Object(h.a)();var O={axis:w.a,bar:{groupMargin:0,margin:0,width:50},className:"histogram-d3",colorScheme:v.a,data:[{bins:[],counts:[]}],delay:0,domain:{max:null,min:null},duration:400,grid:w.b,height:200,margin:{bottom:0,left:5,right:0,top:5},stroke:{color:"#005870",dasharray:"",linecap:"butt",width:0},tip:k.a,tipContainer:"body",tipContentFn:function(t,e,a,n){return n+": "+t[e]+"<br />"+a},visible:{},width:200};return{create:function(e,a){void 0===a&&(a={}),this.mergeProps(a),this._makeSvg(e),this.makeGrid(),this.makeScales(),r=O.data.map(function(e,a){return t.append("g").attr("class","histogram-container-"+a)}),this.update(e,O)},mergeProps:function(t){y()(O,t),t.data&&(O.data=t.data),t.colorScheme&&(O.colorScheme=t.colorScheme)},_makeSvg:function(n){if(t){t.selectAll("svg > *").remove(),t.remove();var r=n.getElementsByTagName("svg");r.length>0&&n.removeChild(r[0])}var i=O.margin,s=O.width,o=O.height,c=O.className;t=Object(m.d)(n).append("svg").attr("class",c).attr("width",s).attr("height",o).attr("viewBox","0 0 "+s+" "+o).append("g").attr("transform","translate("+i.left+","+i.top+")");var l=Object(k.b)(O.tipContainer,e);a=l.tipContent,e=l.tipContainer},valuesCount:function(t){return t.reduce(function(t,e){return e.data.length>t?e.data.length:t},0)},appendDomainRange:function(t,e){var a=[],n=O.domain,r=e.reduce(function(t,e){var a=e.reduce(function(t,e){return[].concat(t,e.map(function(t){return t.value}))},[]);return[].concat(t,a)},[0]),i=Object(d.a)(r,function(t){return t});a[1]=n&&n.hasOwnProperty("max")&&null!==n.max?n.max:Number(i[1]),a[0]=n&&n.hasOwnProperty("min")&&null!==n.min?n.min:Number(i[0]);var s=[l.bandwidth(),0];t.range(s).domain(a)},yAxisWidth:function(){var t=O.axis;return""===t.y.label?t.y.width:t.y.width+30},xAxisHeight:function(){var t=O.axis;return""===t.x.label?t.x.height:t.x.height+30},makeScales:function(){var e=O.axis,a=O.margin,n=O.height,r=O.width;i=t.append("g").attr("class","x-axis"),s=t.append("g").attr("class","y-axis"),""!==e.x.label&&t.append("text").attr("class","x-axis-label").attr("transform","translate("+Number(r)/2+" ,"+(n-this.xAxisHeight()-2*a.left+10+e.x.margin)+")").style("text-anchor","middle").text(e.x.label),""!==e.y.label&&t.append("text").attr("class","y-axis-label").attr("transform","translate(0, -"+this.gridHeight()+")rotate(-90)").attr("y",0-a.left).attr("x",0-(n/2-2*a.top)).attr("dy","1em").style("text-anchor","middle").text(e.y.label)},getBins:function(){return O.data.reduce(function(t,e){return Array.from(new Set(t.concat(e.bins)))},[])},_drawScales:function(e){var a,r=this,o=O.margin,c=O.height,d=O.axis,h=e.reduce(function(t,e){var a=r.valuesCount(e.counts);return a>t?a:t},0),m=this.gridWidth(),y=e[0].counts.map(function(t){return t.label}),v=this.getBins();p.domain(v).rangeRound([0,m]).paddingInner(this.groupedMargin()),g.domain(y).rangeRound([0,p.bandwidth()]).paddingInner(this.barMargin()),a=Object(f.a)(p);var k=b()(d,"x.tickSize",void 0);void 0!==k?a.tickSize(k):m/h<10&&a.tickValues(p.domain().filter(function(t,e){return!(e%10)})),i.attr("transform","translate("+(this.yAxisWidth()+d.y.style["stroke-width"])+","+(c-this.xAxisHeight()-2*o.left)+")").call(a);var w=e.map(function(t){return String(t.title)}),E=[c-2*o.top-this.xAxisHeight(),0];l.domain(w).rangeRound(E),this.appendDomainRange(u,n);var j=Object(f.b)(l).ticks(d.y.ticks),S=b()(d,"y.tickSize",void 0);void 0!==S&&j.tickSize(S),s.attr("transform","translate("+this.yAxisWidth()+", 0)").transition().call(j),Object(x.a)(t.selectAll(".y-axis .domain, .y-axis .tick line"),d.y.style),Object(x.a)(t.selectAll(".y-axis .tick text"),d.y.text.style),Object(x.a)(t.selectAll(".x-axis .domain, .x-axis .tick line"),d.x.style),Object(x.a)(t.selectAll(".x-axis .tick text"),d.x.text.style)},gridWidth:function(){var t=O.width,e=O.margin;return Number(t)-2*e.left-this.yAxisWidth()},gridHeight:function(){return O.height-2*O.margin.top-this.xAxisHeight()},groupedMargin:function(){var t=b()(O.bar,"groupMargin",.1);return t>=0&&t<=1?t:0},barMargin:function(){var t=b()(O.bar,"margin",0);return t>=0&&t<=1?t:.1},barWidth:function(){return g.bandwidth()},updateChart:function(t){var n=this.getBins(),i=O.delay,s=O.duration,o=O.axis,c=O.stroke,d=O.tip,f=O.tipContentFn,m=this.barWidth(),b=Object(h.d)(O.colorScheme),y=Object(h.d)(["#FFF"]),v=this.yAxisWidth();t.forEach(function(t,h){var x=O.data[h].title,k=r[h].selectAll("g").data(t),w=k.enter().append("g").merge(k).attr("transform",function(t){return"translate("+(v+o.y.style["stroke-width"]+(p(t[0].label)||0))+", "+l(t[0].label)+")"}).selectAll("rect").data(function(t){return t});w.enter().append("rect").attr("height",0).attr("y",function(t){return l.bandwidth()}).attr("class","bar").attr("x",function(t){return String(g(t.label))}).attr("width",function(t){return m}).attr("fill",function(t,e){return b(String(e))}).on("mouseover",function(t){var r=n.findIndex(function(e){return e===t.label});a.html(function(){return f(n,r,t.value,x)}),d.fx.in(e)}).on("mousemove",function(){return d.fx.move(e)}).on("mouseout",function(){return d.fx.out(e)}).merge(w).transition().duration(s).delay(i).attr("y",function(t){return u(t.value)}).attr("stroke",function(t,e){return y?y(String(e)):""}).attr("shape-rendering","crispEdges").attr("stroke-width",c.width).attr("stroke-linecap",c.linecap).attr("stroke-dasharray",function(t){var e=l.bandwidth()-u(t.value);return m+" 0 "+e+" "+m}).attr("height",function(t){return l.bandwidth()-u(t.value)}),k.exit().remove()})},makeGrid:function(){o=t.append("g").attr("class","grid gridX"),c=t.append("g").attr("class","grid gridY")},_drawGrid:function(){var t=this,e=O.data,a=O.height,n=O.width,r=O.axis,i=O.grid,s=O.margin,u=e.reduce(function(e,a){var n=t.valuesCount(a.counts);return n>e?e:n},0),d=r.y.style["stroke-width"],h=this.yAxisWidth()+d,m=this.gridHeight();i.x.visible&&(o.attr("transform","translate("+h+", "+m+")"),o.call(function(t){return void 0===t&&(t=5),Object(f.a)(p).ticks(t)}(b()(i,"x.ticks",u)).tickSize(-a+this.xAxisHeight()+2*s.top).tickFormat(function(){return""})),Object(x.a)(o.selectAll(".tick line"),i.x.style),Object(x.a)(o.selectAll(".domain"),Object.assign({},r.y.style,{stroke:"transparent"}))),i.y.visible&&(c.attr("transform","translate("+(this.yAxisWidth()+d)+", 0)").transition().call(function(t){return void 0===t&&(t=5),Object(f.b)(l).ticks(t)}(b()(i,"y.ticks",u)).tickSize(-n+2*s.left+this.yAxisWidth()).tickFormat(function(){return""})),Object(x.a)(c.selectAll(".tick line"),i.y.style),c.selectAll(".gridY .tick line").filter(function(t,e){return 0===e}).attr("display","none"),Object(x.a)(c.selectAll(".domain"),Object.assign({},r.x.style,{stroke:"transparent"})))},update:function(t,e){this.mergeProps(e);var a=O.data,r=O.visible;n=a.map(function(t){var e=[];return t.counts.forEach(function(a){a.data.forEach(function(n,i){e[i]||(e[i]=[]),e[i].push({groupLabel:a.label,joyLabel:t.title,label:t.bins[i],value:!1!==r[t.bins[i]]&&!1!==r[a.label]?n:0})})}),e}),this._drawScales(O.data),this._drawGrid(),this.updateChart(n)},destroy:function(e){t.selectAll("svg > *").remove()}}},E=function(t){function e(e){var a;return(a=t.call(this,e)||this).ref=null,a.chart=O(),a.state={parentWidth:300},a}s()(e,t);var a=e.prototype;return a.handleResize=function(){var t=this,e=this.getDOMNode();if(e){var a=this.ref&&this.ref.offsetWidth?this.ref.offsetWidth:0;this.setState({parentWidth:a},function(){return t.chart.create(e,t.getChartState())})}},a.componentDidMount=function(){var t=this,e=this.getDOMNode();e&&(this.chart.create(e,this.getChartState()),"100%"===this.props.width&&(window.addEventListener("resize",function(e){return t.handleResize()}),this.handleResize()))},a.componentDidUpdate=function(){var t=this.getDOMNode();t&&this.chart.update(t,this.getChartState())},a.getChartState=function(){var t=this.props.width,e=this.props,a=(e.children,r()(e,["children"]));return"100%"===t&&(t=this.state.parentWidth||300),Object.assign({},a,{width:t})},a.componentWillUnmount=function(){var t=this.getDOMNode();t&&("100%"===this.props.width&&window.removeEventListener("resize",this.handleResize),this.chart.destroy(t))},a.getDOMNode=function(){var t=u.a.findDOMNode(this.ref);if(t instanceof HTMLElement)return t},a.render=function(){var t=this;return c.a.createElement("div",{ref:function(e){return t.ref=e},className:"histogram-chart-container"})},e}(o.Component);e.a=E},348:function(t,e,a){"use strict";a.d(e,"c",function(){return i}),a.d(e,"a",function(){return s}),a.d(e,"b",function(){return o}),a.d(e,"d",function(){return c});a(53);var n=a(298),r=a(272),i={x:{style:Object.assign({},r.c,{stroke:"#ccc","stroke-opacity":.4}),ticks:5},y:{style:Object.assign({},r.c,{stroke:"#ccc","stroke-opacity":.4}),ticks:5}},s={bins:["Data 1","Data 6","Data 3","Dat 4"],counts:[{data:[1,2,3,4],label:"DataSet 1"},{data:[13,14,15,16],label:"DataSet 2"}]},o={bins:["bin 1","bin 2","bin 3 with a long name","bin 4","bin 5","bin 6","bin 7"],counts:[{borderColors:["red"],data:[1,2,3,4,5,6,7],label:"Data 1"}],title:"Plot 1"},c=Object(n.a)(["rgba(255, 113, 1, 0.5)","#fff6ef","rgba(0, 169, 123, 0.5)","#f6fffd","#D7263D","rgba(215, 38, 61, 0.05)","#0f2629","#ededed","rgba(86, 180, 191, 0.5)","#f5fbfb","#000000","#0f2629","#D7263D","#FBD7D9","#ffebec","#963540","#22545a","#56b4bf","#56b4bf","#56b4bf","#FF7101","#449098","#77c3cb","#d4eef8","#ff7101","#FF7101","#cc5a00","#ff8d33","#fef9e5","#7d5d2e","#00a97b","#008762","#33ba95","#dbf1d6","#227839","#0f5e7b","#d4eef8","#0f5e7b","#F9C80E","#007656","#c5e5e9","#f9c80e","#a9a9a9","#dbdbdb","#cccccc","#e6e6e6","#56b4bf","#449098","#77c3cb","#22545a","#ff7101","#cdcdcd","#ffffff","#d7263d","#00a97b","#888888","#e6e6e6","#f2f2f2","#f4f4f4"])}}]);
//# sourceMappingURL=component---src-pages-joyplot-tsx-79676d671e1ea347cac2.js.map