Skip to content

Instantly share code, notes, and snippets.

@Cirieneve

Cirieneve/.block

Last active March 24, 2018 17:35
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save Cirieneve/963eaf75014a8f59bafcb87be838bbf8 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save Cirieneve/963eaf75014a8f59bafcb87be838bbf8 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 0 additions and 1 deletion.
    1 change: 0 additions & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -79,7 +79,6 @@

    // For all rectangles, regardless if they were there or not before


    dataRects
    .transition()
    .duration(1000)
  2. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 0 additions and 1 deletion.
    1 change: 0 additions & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -79,7 +79,6 @@

    // For all rectangles, regardless if they were there or not before

    setInterval(function{})

    dataRects
    .transition()
  3. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 4 additions and 1 deletion.
    5 changes: 4 additions & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -77,7 +77,10 @@

    dataRects = dataRects.merge(dataRectsNew);

    // For all rectangles, regardless if they were there or not before
    // For all rectangles, regardless if they were there or not before

    setInterval(function{})

    dataRects
    .transition()
    .duration(1000)
  4. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 1 addition and 2 deletions.
    3 changes: 1 addition & 2 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -77,8 +77,7 @@

    dataRects = dataRects.merge(dataRectsNew);

    // For all rectangles, regardless if they were there or not before

    // For all rectangles, regardless if they were there or not before
    dataRects
    .transition()
    .duration(1000)
  5. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -78,6 +78,7 @@
    dataRects = dataRects.merge(dataRectsNew);

    // For all rectangles, regardless if they were there or not before

    dataRects
    .transition()
    .duration(1000)
  6. Cirieneve revised this gist Mar 24, 2018. No changes.
  7. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -84,7 +84,7 @@
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280))
    //.attr('fill', d=>d.color)
    .attr('fill', d=>data[Math.floor(Math.random()*data.length].color);
    .attr('fill', d=>data[Math.floor(Math.random()*data.length)].color);


    };
  8. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -84,7 +84,7 @@
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280))
    //.attr('fill', d=>d.color)
    .attr('fill', d=>data.color);
    .attr('fill', d=>data[Math.floor(Math.random()*data.length].color);


    };
  9. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -78,13 +78,13 @@
    dataRects = dataRects.merge(dataRectsNew);

    // For all rectangles, regardless if they were there or not before
    // The d is a colour
    dataRects
    .transition()
    .duration(1000)
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280))
    .attr('fill', d=>d.color);
    //.attr('fill', d=>d.color)
    .attr('fill', d=>data.color);


    };
  10. Cirieneve revised this gist Mar 24, 2018. No changes.
  11. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -84,7 +84,7 @@
    .duration(1000)
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280))
    .attr('color', d=>d.color);
    .attr('fill', d=>d.color);


    };
  12. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -67,7 +67,7 @@
    .classed('dataRect', true)
    .attr('width', 20)
    .attr('height', 20)
    //.attr('fill', 'green')
    .attr('fill', 'green')
    .attr('x', 0)
    .attr('y', 0)
    .transition()
  13. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -67,7 +67,7 @@
    .classed('dataRect', true)
    .attr('width', 20)
    .attr('height', 20)
    .attr('fill', 'green')
    //.attr('fill', 'green')
    .attr('x', 0)
    .attr('y', 0)
    .transition()
    @@ -84,7 +84,7 @@
    .duration(1000)
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280))
    .fill('color', d=>d.color);
    .attr('color', d=>d.color);


    };
  14. Cirieneve revised this gist Mar 24, 2018. No changes.
  15. Cirieneve revised this gist Mar 24, 2018. No changes.
  16. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -78,12 +78,13 @@
    dataRects = dataRects.merge(dataRectsNew);

    // For all rectangles, regardless if they were there or not before
    // The d is a colour
    dataRects
    .transition()
    .duration(1000)
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280))
    .fill('color', d=>d);
    .fill('color', d=>d.color);


    };
  17. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -82,7 +82,8 @@
    .transition()
    .duration(1000)
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280));
    .attr('y', () => Math.floor(Math.random()*280))
    .fill('color', d=>d);


    };
  18. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 2 additions and 0 deletions.
    2 changes: 2 additions & 0 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -76,6 +76,8 @@
    .attr('y', () => Math.floor(Math.random()*280));

    dataRects = dataRects.merge(dataRectsNew);

    // For all rectangles, regardless if they were there or not before
    dataRects
    .transition()
    .duration(1000)
  19. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 9 additions and 1 deletion.
    10 changes: 9 additions & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -73,7 +73,15 @@
    .transition()
    .duration(1000)
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280))
    .attr('y', () => Math.floor(Math.random()*280));

    dataRects = dataRects.merge(dataRectsNew);
    dataRects
    .transition()
    .duration(1000)
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280));


    };
    </script>
  20. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 6 additions and 5 deletions.
    11 changes: 6 additions & 5 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -65,15 +65,16 @@
    .enter()
    .append('rect')
    .classed('dataRect', true)
    .attr('x', 0)
    .attr('y', 0)
    .attr('width', 20)
    .attr('height', 20)
    .attr('fill', 'green')
    .attr('x', 0)
    .attr('y', 0)
    .transition()
    .duration(1000)
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280))
    .attr('fill', 'green')
    .transition()
    .duration(1000);

    };
    </script>

  21. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 3 additions and 1 deletion.
    4 changes: 3 additions & 1 deletion index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -71,7 +71,9 @@
    .attr('height', 20)
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280))
    .attr('fill', 'green');
    .attr('fill', 'green')
    .transition()
    .duration(1000);
    };
    </script>

  22. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -69,8 +69,8 @@
    .attr('y', 0)
    .attr('width', 20)
    .attr('height', 20)
    .attr('x', {} => Math.floor(Math.random()*380))
    .attr('y', {} => Math.floor(Math.random()*280))
    .attr('x', () => Math.floor(Math.random()*380))
    .attr('y', () => Math.floor(Math.random()*280))
    .attr('fill', 'green');
    };
    </script>
  23. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -69,8 +69,8 @@
    .attr('y', 0)
    .attr('width', 20)
    .attr('height', 20)
    .attr('x', Math.floor(Math.random()*380))
    .attr('y', Math.floor(Math.random()*280))
    .attr('x', {} => Math.floor(Math.random()*380))
    .attr('y', {} => Math.floor(Math.random()*280))
    .attr('fill', 'green');
    };
    </script>
  24. Cirieneve revised this gist Mar 24, 2018. No changes.
  25. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 2 additions and 0 deletions.
    2 changes: 2 additions & 0 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -69,6 +69,8 @@
    .attr('y', 0)
    .attr('width', 20)
    .attr('height', 20)
    .attr('x', Math.floor(Math.random()*380))
    .attr('y', Math.floor(Math.random()*280))
    .attr('fill', 'green');
    };
    </script>
  26. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 9 additions and 0 deletions.
    9 changes: 9 additions & 0 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -61,6 +61,15 @@
    .selectAll('.dataRect')
    .data(data);

    let dataRectsNew = dataRects
    .enter()
    .append('rect')
    .classed('dataRect', true)
    .attr('x', 0)
    .attr('y', 0)
    .attr('width', 20)
    .attr('height', 20)
    .attr('fill', 'green');
    };
    </script>

  27. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -49,7 +49,7 @@
    .attr('height', 20)
    .attr('fill', 'green');

    // 380 is related to height of SVG since the height is 400 - similar for height
    // 380 is related to width of SVG since the width is 400 - similar for height
    d3Rect
    .transition()
    .duration(1000)
    @@ -59,7 +59,7 @@

    let dataRects = svg
    .selectAll('.dataRect')
    .data(data)
    .data(data);

    };
    </script>
  28. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 4 additions and 2 deletions.
    6 changes: 4 additions & 2 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -49,15 +49,17 @@
    .attr('height', 20)
    .attr('fill', 'green');

    // 380 is related to height of SVG since the height is 400
    // 380 is related to height of SVG since the height is 400 - similar for height
    d3Rect
    .transition()
    .duration(1000)
    .style('display', 'none')
    .attr('x', Math.floor(Math.random()*380))
    .attr('y', Math.floor(Math.random()*280));


    let dataRects = svg
    .selectAll('.dataRect')
    .data(data)

    };
    </script>
  29. Cirieneve revised this gist Mar 24, 2018. No changes.
  30. Cirieneve revised this gist Mar 24, 2018. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -53,6 +53,7 @@
    d3Rect
    .transition()
    .duration(1000)
    .style('display', 'none')
    .attr('x', Math.floor(Math.random()*380))
    .attr('y', Math.floor(Math.random()*280));