{"version":3,"sources":["https://lively-kernel.org/lively4/lively4-eslint/src/components/d3/d3-barchart.js"],"names":["Morph","D3Component","d3","debounce","D3BarChart","initialize","options","loaded","Promise","resolve","updateViz","addEventListener","evt","onExtentChanged","zoom","svgContainer","get","style","width","bounds","getBoundingClientRect","innerHTML","treeData","getData","margin","top","right","bottom","left","height","data","lively","getExtent","x","scaleLinear","domain","max","d","x1","range","lineHeight","y","scaleBand","map","ea","i","length","paddingInner","svgOuter","select","attr","append","call","scaleExtent","on","zoomG","event","transform","svg","vis","node","selectAll","enter","dataX","x0","dataY","dataHeight","bandwidth","dataWidth","Math","rect","dataColor","each","parentData","parentIndex","eachNode","children","onNodeClick","text","dataTitle","maxLabelWidth","shouldPlaceLabelLeft","label","dataLabel","xAxis","axisBottom","xAxisGroup","yAxisHeight","chartHeight","yAxis","axisLeft","yAxisGroup","livelyExample1","setData","livelyExample","config","color","colorGen","scaleOrdinal","schemeCategory10","livelyMigrate","other"],"mappings":"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","file":"d3-barchart.js","sourcesContent":["import Morph from \"src/components/widgets/lively-morph.js\"\nimport D3Component from \"./d3-component.js\"\nimport d3 from \"src/external/d3.v5.js\"\nimport { debounce } from \"utils\";\nimport \"src/external/d3-selection-multi.v1.js\"\n\n\n/*MD # D3 Barchart \n\n![](d3-barchart.png){height=300px}\n\nMD*/\n\nexport default class D3BarChart extends D3Component {\n\n  async initialize() {\n    this.options = this.options || {}\n    this.loaded = new Promise(async (resolve) => {\n      this.updateViz()\n      this.addEventListener('extent-changed', ((evt) => {\n        this.onExtentChanged(evt);\n      })::debounce(500));\n\n      resolve()\n    })\n    \n    this.zoom = false\n  }\n  \n  async updateViz() {\n    var svgContainer = this.get(\"#container\")\n    svgContainer.style.width = this.style.width // hard to find out how to do this in CSS, ... with \"relative\"\n    \n    \n    // svgContainer.style.height = this.style.height\n    \n    \n    var bounds = this.getBoundingClientRect()\n    this.get(\"svg\").innerHTML = \"\"\n\n    var treeData = this.getData()\n    if (!treeData) return; // nothing to render\n\n    var margin = { top: 20, right: 20, bottom: 20, left: 40 }\n    var width = bounds.width;\n    var height = bounds.height;\n    \n    var data = this.getData();\n    if (!data) return;// nothing to to\n\n    var width = lively.getExtent(this).x - 30\n    \n    var x = d3.scaleLinear()\n        .domain([0, d3.max(data, d => d.x1)])\n        .range([0, width]);\n\n    var lineHeight = 20\n    \n    var y =  d3.scaleBand()\n      .domain(data.map((ea, i) => i))\n      .range([0, lineHeight * data.length]);\n    y.paddingInner(0.1);    \n    \n    var svgOuter = d3.select(this.get(\"svg\"))\n      .attr(\"width\", width + margin.right + margin.left)\n      .attr(\"height\", height + margin.top + margin.bottom)\n      .append(\"g\")\n      .attr(\"transform\", `translate(${margin.left},${margin.top})`)\n    \n    if (this.zoom) {\n      svgOuter.append(\"rect\")\n        .attr(\"width\", width)\n        .attr(\"height\", height)\n        .style(\"fill\", \"none\")\n        .style(\"pointer-events\", \"all\")\n        .call(d3.zoom()\n            .scaleExtent([1 / 4, 20])\n            .on(\"zoom\", () => {\n              zoomG.attr(\"transform\", d3.event.transform);\n            }));      \n    }\n    \n    \n    var zoomG = svgOuter.append(\"g\")\n    \n    var svg = zoomG.append(\"g\")\n    \n    var vis = this\n    \n    var node = svg\n      .selectAll(\"g\")\n        .data(data)\n      .enter().append(\"g\")\n  \n    var dataX = d =>  x(d.x0) + \"px\"\n    var dataY = (d, i) =>  y(i)  /* ((lineHeight + margin) * i) + \"px\" */\n    var dataHeight = d => y.bandwidth() + \"px\"\n    var dataWidth = d =>  Math.max(2, x(d.x1 - d.x0)) + \"px\"\n    \n    var rect = node.append(\"rect\")\n        .attr(\"x\", dataX)\n        .attr(\"y\", dataY)\n        .attr(\"height\", dataHeight)\n        .attr(\"width\", dataWidth)\n        .attr(\"fill\", d =>  this.dataColor(d))\n    \n    // first level of children\n    node.each(function(parentData, parentIndex) {\n      var eachNode = d3.select(this);\n      if (!parentData.children) return\n      eachNode\n        .selectAll(\"g\")\n           .data(parentData.children)\n        .enter().append(\"rect\")\n            .attr(\"x\", dataX)\n            .attr(\"y\", d => dataY(parentData, parentIndex))\n            .attr(\"height\", d => vis.dataHeight(d, dataHeight(d)))\n            .attr(\"width\", d => vis.dataWidth(d, dataWidth(d)))\n            .attr(\"fill\", d =>  vis.dataColor(d))\n            .attr(\"opacity\", d =>  0.5)\n            .on(\"click\", function(d) {\n                vis.onNodeClick(d, d3.event, this)\n            })\n            .append(\"title\")\n              .text(d => vis.dataTitle(d)); \n    })\n \n    rect.append(\"title\")\n       .text(d => this.dataTitle(d));  \n    \n    rect.on(\"click\", function(d) {\n        vis.onNodeClick(d, d3.event, this) \n    })\n    \n    \n    var maxLabelWidth = 200 // not enforced?\n    var shouldPlaceLabelLeft = d => x(d.x0) < maxLabelWidth \n    \n    var label = node.append(\"text\") \n        .attr(\"x\",  d => {\n            // return  x(d.x0 + 0.5 * (d.x1 - d.x0)) + \"px\"\n            if (shouldPlaceLabelLeft(d)) {\n              return x(d.x1) + 5 + \"px\"\n            }\n            return x(d.x0) - 5 + \"px\"\n          })\n        .attr(\"y\", (d, i) =>  (y(i) + 0.5 * lineHeight)  + \"px\")\n        .attr(\"height\", dataHeight)\n        .attr(\"width\", dataWidth)\n        .attr('text-anchor', d => {\n          if (shouldPlaceLabelLeft(d)) {\n            return 'start'\n          } else {\n            return 'end'\n          }\n        })\n        .attr('alignment-baseline', 'middle')\n        .attr(\"fill\" ,\"black\")\n        .text(d => this.dataLabel(d));\n    \n      label.append(\"title\")\n       .text(d => this.dataTitle(d));  \n\n      var xAxis = d3.axisBottom(x);\n      var xAxisGroup = svg.append(\"g\").call(xAxis);\n      xAxisGroup.attr(\"transform\", `translate(0, ${y(data.length - 1) + lineHeight})`)\n\n      // we cannot zoom... so we grow ourself\n      if (!this.zoom) {\n        var yAxisHeight = lineHeight // guess\n        var chartHeight = (y(data.length - 1) +  lineHeight) + yAxisHeight\n        svgContainer.style.height =  margin.top +  chartHeight + margin.bottom + \"px\"\n      }\n    \n      var yAxis = d3.axisLeft(y)\n    \n      var yAxisGroup = svg.append(\"g\").call(yAxis);\n      \n      \n    \n      if (!this.zoom) {\n        this.style.height = dataHeight() + \"px\"\n      }\n  }\n\n  onExtentChanged() {\n    this.updateViz()\n  }\n\n  async livelyExample1() {\n    await this.loaded\n    this.setData([\n      {label: \"a\", x0: 0,  x1: 14}, \n      {label: \"b\", x0: 3, x1: 8}, \n      {label: \"c\", x0: 5, x1: 15}, \n      {label: \"d\", x0: 2, x1: 16}, \n      {label: \"e\", x0: 0, x1: 23}, \n      {label: \"f\", x0: 10, x1: 42}\n    ])\n    this.updateViz() \n  }\n\n  async livelyExample() {\n    await this.loaded\n    this.config({\n      color(d) {\n        if (!this.colorGen) {\n          this.colorGen = d3.scaleOrdinal(d3.schemeCategory10);\n        }\n        \n        return this.colorGen(d.label)\n      }\n    });\n    this.setData([\n      {label: \"a\", x0: 0,  x1: 14, \n       children: [\n         {label: \"a1\", x0: 4,  x1: 8},\n         {label: \"a2\", x0: 8,  x1: 12},\n        ]}, \n      {label: \"b\", x0: 3, x1: 8}, \n      {label: \"c\", x0: 5, x1: 15}, \n      {label: \"d\", x0: 2, x1: 16}, \n      {label: \"e\", x0: 0, x1: 23}, \n      {label: \"f\", x0: 10, x1: 42, \n        children: [\n         {label: \"f1\", x0: 11,  x1: 16},\n         {label: \"f2\", x0: 18,  x1: 40},\n        ]}\n    ])\n    this.updateViz() \n  }\n\n  \n  \n  livelyMigrate(other) {\n    this.options = other.options\n    this.setData(other.getData())\n  }\n\n}\n"]}