<commit_before>d3.chart('Base').extend('DiagonalLine', {
  initialize: function (options) {
    this.options = options = options || {};

    this.linePath = this.base.append('svg:g').classed('diagonalLine', true);

    this.diagonal = d3.svg.diagonal()
      .projection(function (d) {
        return [d.y, d.x];
      });

    var tree = d3.layout.tree()
      .size([options.info.canvasH, options.info.canvasW]);

    this.layer('diagonalLine', this.linePath, {
      dataBind: function (data) {
        var chart = this.chart();

        // Setup the auto resize to handle the on resize event
        //chart.dispatch.on('d3maSingleWindowResize', function (chart, single) {
        //  single.attr({'d': chart.diagonal});
        //});

        chart.nodes = tree.nodes(data).reverse();
        var links = tree.links(chart.nodes);

        // Stash the old positions for transition.
        chart.nodes.forEach(function (d) {
          d.x0 = d.x;
          d.y0 = d.y;
        });

        if (chart.onDataBind) {
          chart.onDataBind(data, chart);
        }

        return this.selectAll("path.link")
          .data(links, function (d) {
            return d.target.id;
          });
      },

      insert: function () {
        var chart = this.chart();
        if (chart.onInsert) {
          chart.onInsert(chart);
        }

        return this.insert("path", "g")
          .attr("class", "link");
      },

      events: {
        'enter': function () {
          var chart = this.chart();

          // chart  # refer to this context, used it to access xScale, yScale, width, height, etc.
          // chart property this   # refer to each individual group just appended by insert command
          if (chart.onEnter) {
            chart.onEnter(chart, this);
          }

          this.attr("d", function (d) {
            var o = {
              x: options.info.canvasH / 2,
              y: 0
            };
            return chart.diagonal({source: o, target: o});
          });
        },

        'enter:transition': function () {
          var chart = this.chart();
          this
            .duration(750)
            .ease('cubic-out')
            .attr({'d': chart.diagonal})
        },

        'merge': function () {
          var chart = this.chart();

          chart._onWindowResize(chart, this);
        },

        'exit:transition': function () {
          var chart = this.chart();
          this
            .duration(400)
            .ease('cubic-in')
            .style('opacity', 1e-6)
            .remove();
        }
      }
    });
  },
<commit_msg>successfully simulate the initial animation on drawing the data point and its path<commit_after>d3.chart('Base').extend('DiagonalLine', {
  initialize: function (options) {
    this.options = options = options || {};

    this.linePath = this.base.append('svg:g').classed('diagonalLine', true);

    this.diagonal = d3.svg.diagonal()
      .projection(function (d) {
        return [d.y, d.x];
      });

    var tree = d3.layout.tree()
      .size([options.info.canvasH, options.info.canvasW]);

    this.layer('diagonalLine', this.linePath, {
      dataBind: function (data) {
        var chart = this.chart();

        // Setup the auto resize to handle the on resize event
        //chart.dispatch.on('d3maSingleWindowResize', function (chart, single) {
        //  single.attr({'d': chart.diagonal});
        //});

        chart.nodes = tree.nodes(data).reverse();
        var links = tree.links(chart.nodes);

        // Normalize for fixed-depth.
        chart.nodes.forEach(function (d) {
          d.y = d.depth * 180;
        });


        if (chart.onDataBind) {
          chart.onDataBind(data, chart);
        }

        return this.selectAll("path.link")
          .data(links, function (d) {
            return d.target.id;
          });
      },

      insert: function () {
        var chart = this.chart();
        if (chart.onInsert) {
          chart.onInsert(chart);
        }

        return this.insert("path", "g")
          .attr("class", "link");
      },

      events: {
        'enter': function () {
          var chart = this.chart();

          // chart  # refer to this context, used it to access xScale, yScale, width, height, etc.
          // chart property this   # refer to each individual group just appended by insert command
          if (chart.onEnter) {
            chart.onEnter(chart, this);
          }

          this.attr("d", function (d) {
            // from the center of the tree, animate to the point
            var o = {
              x: options.info.canvasH / 2,
              y: 0
            };
            return chart.diagonal({source: o, target: o});
          });

          // Stash the old positions for transition.
          chart.nodes.forEach(function (d) {
            d.x0 = d.x;
            d.y0 = d.y;
          });
        },

        'enter:transition': function () {
          var chart = this.chart();
          this
            .duration(750)
            // .ease('cubic-out')
            .attr({'d': chart.diagonal});
        },

        'merge': function () {
          var chart = this.chart();

          chart._onWindowResize(chart, this);
        },

        'exit:transition': function () {
          var chart = this.chart();
          this
            .duration(400)
            .ease('cubic-in')
            .style('opacity', 1e-6)
            .remove();
        }
      }
    });
  },

{'fraction_non_alphanumeric': 0.14468396054073804, 'fraction_numerical': 0.00639386189258312, 'mean_word_length': 1.5776836158192091, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6312479', 'n_tokens_mistral': 1626, 'n_tokens_neox': 1552, 'n_words': 364}