D3.js vs Vue.js examples
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

2 lines
8.8 KiB

webpackJsonp([1,2],[,,,,,,,,,function(t,e,n){"use strict";n.d(e,"a",function(){return r});var a=n(31),r=[{name:"Circle: mount",path:"/circle-mount",component:n(83)},{name:"Circle: size controller",path:"/size-controller",component:n(86)},{name:"Bars: styles basic",path:"/bars-style-basic",component:n(81)},{name:"Bars: styles scoped",path:"/bars-style-scoped",component:n(82)},{name:"Pie chart: local component & props",path:"/pie-chart-local-component",folder:!0,component:n(84)}].map(function(t){var e=t;return e.href="#"+t.path,e.source=a.githubLink+a.d3ComponentsPath+t.path+(t.folder?"":".vue"),e})},,,,,,,,,,,,,,,,,,,,,,function(t,e){t.exports={githubLink:"https://github.com/corpglory/d3vue/",d3ComponentsPath:"tree/master/src/d3-components"}},function(t,e,n){"use strict";var a=n(44),r=n.n(a),i=n(17),s=n.n(i),c=n(96),o=n.n(c),u=n(80),l=n.n(u),d=n(9);s.a.use(o.a),e.a=new o.a({routes:[{path:"/",name:"Menu",component:l.a}].concat(r()(d.a))})},function(t,e,n){n(75);var a=n(0)(n(34),n(92),"data-v-41b7bac0",null);t.exports=a.exports},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=n(79),r=n.n(a);e.default={name:"app",components:{topNav:r.a}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=n(9),r=n(31);e.default={computed:{prev:function(){var t=this.findIndex();if(t!=-1)return t>0?a.a[t-1]:void 0},next:function(){var t=this.findIndex();if(t!=-1)return t+1<a.a.length?a.a[t+1]:void 0},sourceHref:function(){var t=this.findIndex();return t==-1?r.githubLink:a.a[t].source}},methods:{findIndex:function(){var t=this.$route.path;return a.a.findIndex(function(e){return e.path===t})}}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=n(9);e.default={data:function(){return{items:a.a}}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=n(3);e.default={mounted:function(){var t=a.select(this.$el),e=+t.attr("width"),n=+t.attr("height"),r=[{name:"one",val:100},{name:"two",val:150},{name:"three",val:200}],i=a.scaleBand().rangeRound([0,e]).padding(.1).domain(r.map(function(t){return t.name})),s=a.scaleLinear().rangeRound([n,0]).domain([0,a.max(r,function(t){return t.val})]);t.selectAll("rect").data(r).enter().append("rect").attr("x",function(t){return i(t.name)}).attr("class",function(t){return t.name}).attr("y",function(t){return s(t.val)}).attr("width",i.bandwidth()).attr("height",function(t){return n-s(t.val)})}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=n(3);e.default={mounted:function(){var t=(this.$el.attributes[0],a.select(this.$el)),e=+t.attr("width"),n=+t.attr("height"),r=[{name:"one",val:100},{name:"two",val:150},{name:"three",val:200}],i=a.scaleBand().rangeRound([0,e]).padding(.1).domain(r.map(function(t){return t.name})),s=a.scaleLinear().rangeRound([n,0]).domain([0,a.max(r,function(t){return t.val})]);t.selectAll("rect").data(r).enter().append("rect").attr("data-v-0e55e99d","").attr("x",function(t){return i(t.name)}).attr("class",function(t){return t.name}).attr("y",function(t){return s(t.val)}).attr("width",i.bandwidth()).attr("height",function(t){return n-s(t.val)})}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=n(3);e.default={mounted:function(){a.select(this.$el).append("circle").attr("cx","250").attr("cy","150").attr("r","100")}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=n(78),r=n(85),i=[{name:"Sarah",value:2502},{name:"Emma",value:2005},{name:"Laura",value:1968},{name:"Chloé",value:1863},{name:"Marie",value:1810},{name:"Emily",value:1637},{name:"Léa",value:1592},{name:"Camille",value:1572},{name:"Anna",value:1433},{name:"Manon",value:1403}];e.default={components:{pie:r},data:function(){return{names:a.take(i,3)}},computed:{canAddAName:function(){return this.names.length<i.length}},methods:{addName:function(){this.names.push(i[this.names.length])}}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=n(3);e.default={mounted:function(){var t=a.select(this.$el),e=+t.attr("width"),n=+t.attr("height"),r={top:20,left:0,bottom:30,right:0},i=e-(r.left+r.right),s=n-(r.top+r.bottom);this.chartLayer=t.append("g").attr("transform","translate("+r.left+", "+r.top+")"),this.arc=a.arc().outerRadius(s/2).innerRadius(s/4).padAngle(.03).cornerRadius(8),this.pieG=this.chartLayer.append("g").attr("transform","translate("+i/2+", "+s/2+")"),this.drawChart(this.data)},props:["data"],watch:{data:function(t){this.drawChart(t)}},methods:{drawChart:function(t){var e=a.pie().sort(null).value(function(t){return t.value})(t),n=this.pieG.selectAll(".arc").data(e);n.select("path").attr("d",this.arc);var r=n.enter().append("g").classed("arc",!0);r.append("path").attr("d",this.arc).attr("id",function(t,e){return"arc-"+e}).attr("stroke","gray").attr("fill",function(t){return a.interpolateCool(Math.random())}),r.append("text").attr("dx",10).attr("dy",-5).append("textPath").attr("xlink:href",function(t,e){return"#arc-"+e}).text(function(t){return t.data.name})}}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=n(3);e.default={data:function(){return{circleSize:50}},mounted:function(t){var e=a.select(this.$el).select("svg");this.circle=e.append("circle").attr("cx","250").attr("cy","150").attr("r",this.circleSize)},watch:{circleSize:function(t){this.circle.attr("r",t)}}}},,,,,,,,,,,,,,,,,,,,,,,,,,,,,function(t,e){},function(t,e){},function(t,e){},function(t,e){},function(t,e){},function(t,e){},function(t,e){},,function(t,e,n){n(71);var a=n(0)(n(35),n(88),"data-v-098bb42e",null);t.exports=a.exports},function(t,e,n){n(74);var a=n(0)(n(36),n(91),"data-v-417810ac",null);t.exports=a.exports},function(t,e,n){n(73);var a=n(0)(n(37),n(90),null,null);t.exports=a.exports},function(t,e,n){n(72);var a=n(0)(n(38),n(89),"data-v-0e55e99d",null);t.exports=a.exports},function(t,e,n){n(77);var a=n(0)(n(39),n(95),null,null);t.exports=a.exports},function(t,e,n){var a=n(0)(n(40),n(87),null,null);t.exports=a.exports},function(t,e,n){var a=n(0)(n(41),n(94),null,null);t.exports=a.exports},function(t,e,n){n(76);var a=n(0)(n(42),n(93),null,null);t.exports=a.exports},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",[n("h3",[t._v("Most popular female names in the world")]),t._v(" "),n("pie",{attrs:{data:t.names}}),t._v(" "),n("br"),t._v(" "),t.canAddAName?n("button",{on:{click:t.addName}},[t._v("Add a name")]):t._e()],1)},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{attrs:{id:"holder"}},[n("div",{staticClass:"links"},[t.prev?n("a",{staticClass:"prev",attrs:{href:t.prev.href}},[t._v(" < prev ")]):t._e(),t._v(" "),n("a",{staticClass:"source",attrs:{href:t.sourceHref}},[t._v(" source ")]),t._v(" "),t.next?n("a",{staticClass:"next",attrs:{href:t.next.href}},[t._v(" next > ")]):t._e()])])},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("svg",{attrs:{width:"500",height:"300"}})},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("svg",{attrs:{id:"bars-style-basic-svg",width:"500",height:"300"}})},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"hello"},[n("ul",t._l(t.items,function(e){return n("li",[n("a",{attrs:{href:e.href}},[t._v(t._s(e.name))])])}))])},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{attrs:{id:"app"}},[t._m(0),t._v(" "),n("h2",[t._v(t._s(t.$route.name))]),t._v(" "),n("top-nav"),t._v(" "),n("router-view")],1)},staticRenderFns:[function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("a",{attrs:{href:"#/"}},[n("h1",[t._v(" D3.js vs Vue.js examples ")])])}]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",[n("svg",{attrs:{width:"500",height:"300"}}),t._v(" "),n("br"),t._v(" "),n("input",{directives:[{name:"model",rawName:"v-model",value:t.circleSize,expression:"circleSize"}],attrs:{type:"range",min:"1",max:"100",step:"1"},domProps:{value:t._s(t.circleSize)},on:{input:function(e){t.circleSize=e.target.value}}})])},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("svg",{attrs:{width:"500",height:"300"}})},staticRenderFns:[]}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("svg",{attrs:{width:"500",height:"300"}})},staticRenderFns:[]}},,,,function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=n(17),r=n.n(a),i=n(33),s=n.n(i),c=n(32);new r.a({el:"#app",router:c.a,template:"<app/>",components:{app:s.a}})}],[99]);
//# sourceMappingURL=app.53dc1a8721bd1693c475.js.map