{"version":3,"sources":["webpack:////Users/owenli/Documents/workspace/awi-wool-fe/src/views/blocks/woolpollInteractiveGraphBlock/js/woolpollInteractiveGraphBlock.js"],"names":["CLS","d3","require","WoolpollInteractiveGraphBlock","element","_this","this","_classCallCheck","$element","$","$levyBtn1","find","$levyBtn2","$levyBtn3","$levyBtn4","$btns","concat","$data","data","margin","top","right","bottom","left","width","height","svg","select","append","attr","x","scaleBand","range","domain","levyData1","map","d","group","padding","y","scaleLinear","call","axisBottom","axisLeft","update","on","e","css","background","levyData2","levyData3","levyData4","key","value","_this2","u","selectAll","enter","merge","transition","duration","bandwidth"],"mappings":"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","file":"block-43.430117f348aedc9992ce.js","sourcesContent":["const NS = 'WoolpollInteractiveGraphBlock';\nconst CLS = 'woolpollInteractiveGraphBlock';\n\nlet d3 = require('d3');\n\nimport data from '../model/woolpollInteractiveGraphBlock.json';\n\nexport class WoolpollInteractiveGraphBlock {\n\tconstructor(element) {\n\t\tthis.element = element;\n\t\tthis.$element = $(element);\n\t\tthis.$levyBtn1 = this.$element.find(`#levyBtn1`);\n\t\tthis.$levyBtn2 = this.$element.find(`#levyBtn2`);\n\t\tthis.$levyBtn3 = this.$element.find(`#levyBtn3`);\n\t\tthis.$levyBtn4 = this.$element.find(`#levyBtn4`);\n\t\tthis.$btns = this.$element.find(`.${CLS}-btns button`);\n\t\tthis.$data = data;\n\n\t\tthis.margin = {top: 30, right: 30, bottom: 70, left: 60},\n\t\tthis.width = this.$element.width() - this.margin.left - this.margin.right,\n\t\tthis.height = 600 - this.margin.top - this.margin.bottom;\n \n\t\tthis.svg = d3.select(`.woolpollInteractiveGraphBlock-chart`)\n\t\t.append(\"svg\")\n\t\t\t.attr(\"width\", this.width + this.margin.left + this.margin.right)\n\t\t\t.attr(\"height\", this.height + this.margin.top + this.margin.bottom)\n\t\t.append(\"g\")\n\t\t\t.attr(\"transform\",\n\t\t \"translate(\" + this.margin.left + \",\" + this.margin.top + \")\");\n\n\t\tthis.x = d3.scaleBand()\n\t\t.range([ 0, this.width ])\n\t\t.domain(this.$data.levyData1.map(function(d) { return d.group; }))\n\t\t.padding(0.2);\n \n\t\tthis.y = d3.scaleLinear()\n\t\t.domain([0, 80000])\n\t\t.range([ this.height, 0]);\n\n\t\tthis.svg.append(\"g\")\n\t\t.attr(\"transform\", \"translate(0,\" + this.height + \")\")\n\t\t.call(d3.axisBottom(this.x))\n\n\t\tthis.svg.append(\"g\")\n\t\t.attr(\"class\", \"myYaxis\")\n\t\t.call(d3.axisLeft(this.y));\n \n\t\tthis.update(this.$data.levyData1)\n\t\tthis.$levyBtn1.on( \"click\", (e) => {\n\t\t\tthis.$btns.css({\"background\":\"#000\"});\n this.$levyBtn1.css({\"background\":\"#89d12b\"});\n\t\t\tthis.update(this.$data.levyData1)\n\t\t});\n\t\tthis.$levyBtn2.on( \"click\", (e) => {\n\t\t\tthis.$btns.css({\"background\":\"#000\"});\n this.$levyBtn2.css({\"background\":\"#89d12b\"});\n\t\t\tthis.update(this.$data.levyData2)\n\t\t});\n\t\tthis.$levyBtn3.on( \"click\", (e) => {\n\t\t\tthis.$btns.css({\"background\":\"#000\"});\n this.$levyBtn3.css({\"background\":\"#89d12b\"});\n\t\t\tthis.update(this.$data.levyData3);\n\t\t});\n\t\tthis.$levyBtn4.on( \"click\", (e) => {\n\t\t\tthis.$btns.css({\"background\":\"#000\"});\n this.$levyBtn4.css({\"background\":\"#89d12b\"});\n\t\t\tthis.update(this.$data.levyData4)\n\t\t});\n\n\t}\n\n\tupdate(data) {\n\t\tthis.u = this.svg.selectAll(\"rect\").data(data);\n\t\tthis.u\n\t\t .enter()\n\t\t .append(\"rect\")\n\t\t .merge(this.u)\n\t\t .transition()\n\t\t .duration(1000)\n\t\t\t.attr(\"x\", d => this.x(d.group))\n\t\t\t.attr(\"y\", d => this.y(d.value))\n\t\t\t.attr(\"width\", this.x.bandwidth())\n\t\t\t.attr(\"height\", d => this.height - this.y(d.value))\n\t\t\t.attr(\"fill\", d => {\n\t\t\t if (d.group == 'Levy'){\n\t\t\t return '#2e5f7f'\n\t\t\t }else if (d.group == 'government'){\n\t\t\t return '#da7842'\n\t\t\t }else if (d.group == 'licensing'){\n\t\t\t return '#34692e'\n\t\t\t }else if (d.group == 'investment'){\n\t\t\t return '#489cd0'\n\t\t\t }else if (d.group == 'other'){\n\t\t\t\t return '#93358f'\n\t\t\t }else if (d.group == 'total'){\n\t\t\t\t return '#89d12b'\n\t\t\t }\n\t\t\t})\n\t }\n}\n"],"sourceRoot":""}