// let simulation = d3.forceSimulation();
// function draw() {
// simulation = simulation
// .force("collide", d3.forceCollide(d => d.Length + 3).iterations(12))
// .force("charge", d3.forceManyBody())
// .velocityDecay(0.75) //akin to atmosphere friction
// .alphaDecay(0.006) //if at 0 simulation runs forever
// .force("center", d3.forceCenter(width / 2, height / 2))
// .force("y", d3.forceY(0))
// .force("x", d3.forceX(0))
// const ticked = () => {
// nodeGroup.selectAll("circle")
// .attr("cx", d => d.x)
// .attr("cy", d => d.y);
// }
// simulation
// .nodes(data)
// .on("tick", ticked);
// const colorObj = {
// Fruit : '#a497b8',
// Vegetable: '#bbd0d1',
// Grain: '#caced1',
// Protein: '#ffbcaf',
// Other: '#cf3759',
// };
// const xAccessor = d => d.Month;
// const colorAccessor = d => d.Type;
// const max_length = d3.max(data, d => d.Length)
// const rAccessor = d => d.Length;
// const rScale = d3.scaleSqrt()
// .domain([0, max_length])
// .range([0, 8])
// const node = nodeGroup.selectAll("circle")
// .data(simulation.nodes(), d => d.Name)
// .enter().append("circle")
// .attr("r", d => rScale(rAccessor(d)))
// .attr('fill', d => colorObj[colorAccessor(d)])
// .call(d3.drag()
// .on("start", dragstarted)
// .on("drag", dragged)
// .on("end", dragended));
// node.attr("r", d => rScale(rAccessor(d)))
// .attr('fill', d => colorObj[colorAccessor(d)])
// .call(d3.drag()
// .on("start", dragstarted)
// .on("drag", dragged)
// .on("end", dragended));
// }
// draw();
// function split() {
// simulation
// .force("leftleft", isolate(d3.forceX(width / 3.9).strength(0.3), d => d.Type === 'Grain'))
// .force("left", isolate(d3.forceX(width / 3).strength(0.3), d => d.Type === 'Vegetable'))
// .force("center", isolate(d3.forceX(width / 2.2).strength(0.3), d => d.Type === 'Protein'))
// .force("right", isolate(d3.forceX(width / 1.7).strength(0.3), d => d.Type === 'Fruit'))
// .force("rightright", isolate(d3.forceX(width / 1.5).strength(0.3), d => d.Type === 'Other'))
// .force("x", null)
// .force("y", d3.forceY(height / 2).strength(0.3))
// svg.select('#grain_label')
// .transition()
// .delay(1000)
// .duration(1000)
// .attr('opacity', 1);
// // svg.select('#category_1')
// // .transition()
// // .delay(1000)
// // .duration(1000)
// // .attr('opacity', 1);
// // svg.select('#category_2')
// // .transition()
// // .delay(1000)
// // .duration(1000)
// // .attr('opacity', 1);
// }
// function restart() {
// simulation
// .force("leftleft", null)
// .force("left", null)
// .force("right", null)
// .force("rightright", null)
// simulation
// .force("collide", d3.forceCollide(d => d.Length + 3).iterations(12))
// .force("charge", d3.forceManyBody())
// .velocityDecay(0.75) //akin to atmosphere friction
// .alphaDecay(0.006) //if at 0 simulation runs forever
// .force("center", d3.forceCenter(width / 2, height / 2))
// .force("y", d3.forceY(0))
// .force("x", d3.forceX(0))
// svg.selectAll('text').remove()
// }
// function draw1() {
// const monthKeys = _.uniq(data.map(d => d.Month))
// const max = d3.max(data, d => d.Length)
// const xScale = d3.scaleBand()
// .domain(monthKeys)
// .range([0, width])
// .padding(0.3);
// // const xScale = d3.scaleLinear().domain([-1, 0]).range([0, width]).clamp(true)
// const rScale = d3.scaleSqrt().domain([0, max]).range([0, 8])
// simulation
// .force('forceX', d3.forceX().strength(2).x(d => xScale(d.Month)))
// .force('forceY', d3.forceY().strength(0.2).y(height/2))
// .force('collide', d3.forceCollide(d => rScale(d.Length) + 0.5))
// .stop();
// const NUM_ITERATIONS = 300;
// for (let i = 0; i < NUM_ITERATIONS; ++i) {
// simulation.tick();
// };
// simulation.stop();
// nodeGroup.selectAll("circle")
// .data(data, d => d.Name)
// .join('circle')
// .attr("cx", d => d.x)
// .attr("cy", d => d.y)
// .attr("r", d => rScale(d.Length))
// .style("fill", "#bdbdbd");
// const xAxisGenerator = d3.axisBottom()
// .scale(xScale)
// const xAxis =
// svg.append("g")
// .call(xAxisGenerator)
// .style("transform", `translate(-30px, ${height*0.6}px`)
// .selectAll('text')
// .attr('text-anchor', 'middle')
// .style('font-size', '14px')
// .attr('font-family', 'Freight')
// svg.selectAll('.domain')
// .remove()
// svg.selectAll('line')
// .remove()
// }
// function res(force) {
// let initialize = force.initialize;
// force.initialize = function() { initialize.call(force, data); };
// return force;
// }
// function isolate(force, filter) {
// let initialize = force.initialize;
// force.initialize = function() { initialize.call(force, data.filter(filter)); };
// return force;
// }
// function dragstarted(d) {
// if (!d3.event.active) simulation.alphaTarget(1).restart();
// d.fx = d.x;
// d.fy = d.y;
// }
// function dragged(d) {
// d.fx = d3.event.x;
// d.fy = d3.event.y;
// }
// function dragended(d) {
// if (!d3.event.active) simulation.alphaTarget(0);
// d.fx = null;
// d.fy = null;
// }
// return Object.assign(svg.node(), { split, restart, draw1 });
// }