<commit_before>// Do the rendering
function renderChartObject(bindTag, chart, chartHeight, chartWidth) {

  // Create our svg
  var svg = d3.select(bindTag + " svg")
    .attr("viewBox", "0 0 " + chartWidth + " " + chartHeight)
    .attr("preserveAspectRatio", "xMinYMin meet");

  // If we are talking time series skip
  if (chart.isTimeSeries && (chart.type == 'line')) {
    renderTimeseriesChartObject(bindTag, chart)
    return;
  }

  // Calculate padding at top (and left) of SVG
  var padding = 25;
  var paddingLeft = 100;
  if (chart.subtitle != '') {
    padding += 15;
  }

  var types = chart.type === 'barline' ? chart.types : {};
  var groups = chart.type === 'barline' ? chart.groups : [];
  var type = checkType(chart);
  var rotate = chart.type === 'rotated';
  var yLabel = rotate === true ? chart.unit : '';
  if ((chart.unit != '') && (rotate === false)) {
    padding += 24;
  }
  if ((chart.unit != '') && (rotate === true)) {
    paddingLeft += 100;
  }

  // Calculate padding at bottom of SVG
  var bottomPadding = 20;
  if ((chart.source != '')) {
    bottomPadding += 5;
  }

  // work out position for chart legend
  var seriesCount = chart.series.length;
  var yOffset = (chart.legend == 'bottom-left' || chart.legend == 'bottom-right') ? seriesCount * 20 + 10 : 5;

  // Generate the chart
  c3.generate({
    bindto: bindTag,
    size: {
      height: chartHeight,
      width: chartWidth
    },
    data: {
      json: chart.data,
      keys: {
        value: chart.series
      },
      type: type,
      types: types,
      groups: groups
    },
    legend: {
      hide: chart.hideLegend,
      position: 'inset',
      inset: {
        anchor: chart.legend,
        x: 10,
        y: yOffset
      }
    },
    axis: {
      x: {
        label: chart.xaxis,
        type: 'category',
        categories: chart.categories
      },
      y: {
        label: yLabel
      },
      rotated: rotate
    },
    grid: {
      y: {
        show: true
      }
    },
    padding: {
      top: padding,
      bottom: bottomPadding,
      left: paddingLeft
    }
  });

  // annotate
  renderAnnotations(bindTag, chart);

  function renderAnnotations(bindTag, chart) {

    var unitTop = (chart.subtitles != '') ? 60 : 45; // Hard coded values for unitTop

    // annotate
    d3.select(bindTag + ' svg').append('text') // Title
      .attr('x', 20)
      .attr('y', 25)
      .style('font-size', '20px')
      .style('fill', '#000000')
      .text(chart.title);

    if (chart.subtitle != '') {
      d3.select(bindTag + ' svg').append('text') // Subtitle
        .attr('x', 20)
        .attr('y', 36)
        .attr('text-anchor', 'left')
        .style('font-size', '15px')
        .style('fill', '#999999')
        .text(chart.subtitle);
    }

    if (chart.unit && !rotate) {
      d3.select(bindTag + ' svg').append('text') // Unit (if non rotated)
        .attr('x', 20)
        .attr('y', unitTop)
        .attr('text-anchor', 'left')
        .style('font-size', '15px')
        .style('fill', '#000000')
        .text(chart.unit);
    }

    var viewBoxHeight = d3.select(bindTag + ' svg').attr('height');
    var viewBoxWidth = d3.select(bindTag + ' svg').attr('width');

    if (chart.source != '') {
      d3.select(bindTag + ' svg').append('text') // Source
        .attr("transform", "translate(" + (viewBoxWidth) + "," + (viewBoxHeight) + ")")
        .attr('text-anchor', 'end')
        .style('font-size', '12px')
        .style('fill', '#999999')
        .text(chart.source);
    }
  }

  function checkType(chart) {
    if (chart.type === 'rotated') {
      type = 'bar';
      return type;
    } else if (chart.type === 'barline') {
      type = 'bar';
      return type;
    } else {
      return type = chart.type;
    }
  }


  function renderTimeseriesChartObject(bindTag, timechart) {
    var padding = 25;
    var chart = timechart //timeSubchart(timechart, period);

    // Create a dictionary so we can reverse lookup a tooltip label
    var dates_to_label = {};
    _.each(chart.timeSeries, function (data_point) {
      data_point.date = new Date(data_point.date);
      dates_to_label[data_point.date] = data_point.label;
    });

    // make room for titles if necessary
    if (chart.subtitle != '') {
      padding += 16;
    }
    if (chart.unit != '') {
      padding += 24;
    }

    // should we show
    var showPoints = true;
    if (chart.data.length > 100) {
      showPoints = false;
    }

    // work out position for chart legend
    var seriesCount = chart.series.length;
    var yOffset = (chart.legend == 'bottom-left' || chart.legend == 'bottom-right') ? seriesCount * 20 + 10 : 5;


    // refers to the issue of time axes not being applicable to non continuous charts
    var axisType;
    var keys;

    if (chart.type == 'line') { // continuous line charts
      axisType = {
        label: chart.xaxis,
        type: 'timeseries',
      }

      var monthsOnTimeline = (chart.timeSeries[chart.timeSeries.length - 1].date - chart.timeSeries[0].date) / (1000 * 60 * 60 * 24 * 30);
      var tick = {
        format: function (x) {
          return x.getFullYear();
        }
      }
      if (monthsOnTimeline <= 24.5) {
        tick = {
          format: function (x) {
            return formattedMonthYear(x);
          }
        }
      }


      axisType.tick = tick;
      keys = {
        x: 'date',
        value: chart.series
      }
    } else { // bar charts and other
      axisType = {
        label: chart.xaxis,
        type: 'category',
        categories: chart.categories
      }
      keys = {
        x: 'label',
        value: chart.series
      }
    }

    c3.generate({
      bindto: bindTag,

      data: {
        json: chart.timeSeries,
        keys: keys,
        type: chart.type,
        xFormat: '%Y-%m-%d %H:%M:%S'
      },

      point: {
        show: showPoints
      },

      legend: {
        hide: chart.hideLegend,
        position: 'inset',
        inset: {
          anchor: chart.legend,
          x: 10,
          y: yOffset
        }
      },

      axis: {
        x: axisType
      },
      tooltip: {
        format: {
          title: function (x) {
            return dates_to_label[x];
          }
        }
      },
      grid: {
        y: {
          show: true
        }
      },
      padding: {
        top: padding
      }
    });

    renderAnnotations(bindTag, chart);
  }

  function formattedMonthYear(date) {
    var monthNames = [
      "Jan", "Feb", "Mar",
      "Apr", "May", "Jun", "Jul",
      "Aug", "Sep", "Oct",
      "Nov", "Dec"];

    var monthIndex = date.getMonth();
    var year = date.getFullYear();

    return monthNames[monthIndex] + " " + year;
  }
}<commit_msg>Add font in chart builder<commit_after>// Do the rendering
function renderChartObject(bindTag, chart, chartHeight, chartWidth) {

  // Create our svg
  var svg = d3.select(bindTag + " svg")
    .attr("viewBox", "0 0 " + chartWidth + " " + chartHeight)
    .attr("preserveAspectRatio", "xMinYMin meet");

  // If we are talking time series skip
  if (chart.isTimeSeries && (chart.type == 'line')) {
    renderTimeseriesChartObject(bindTag, chart)
    return;
  }

  // Calculate padding at top (and left) of SVG
  var padding = 25;
  var paddingLeft = 100;
  if (chart.subtitle != '') {
    padding += 15;
  }

  var types = chart.type === 'barline' ? chart.types : {};
  var groups = chart.type === 'barline' ? chart.groups : [];
  var type = checkType(chart);
  var rotate = chart.type === 'rotated';
  var yLabel = rotate === true ? chart.unit : '';
  if ((chart.unit != '') && (rotate === false)) {
    padding += 24;
  }
  if ((chart.unit != '') && (rotate === true)) {
    paddingLeft += 100;
  }

  // Calculate padding at bottom of SVG
  var bottomPadding = 20;
  if ((chart.source != '')) {
    bottomPadding += 25;
  }

  // work out position for chart legend
  var seriesCount = chart.series.length;
  var yOffset = (chart.legend == 'bottom-left' || chart.legend == 'bottom-right') ? seriesCount * 20 + 10 : 5;

  // Generate the chart
  c3.generate({
    bindto: bindTag,
    size: {
      height: chartHeight,
      width: chartWidth
    },
    data: {
      json: chart.data,
      keys: {
        value: chart.series
      },
      type: type,
      types: types,
      groups: groups
    },
    legend: {
      hide: chart.hideLegend,
      position: 'inset',
      inset: {
        anchor: chart.legend,
        x: 10,
        y: yOffset
      },
      title: chart.title,
      subTitle: chart.subtitle
    },
    axis: {
      x: {
        label: chart.xaxis,
        type: 'category',
        categories: chart.categories
      },
      y: {
        label: yLabel,
        position: 'outer-top'
      },
      rotated: rotate
    },
    grid: {
      y: {
        show: true
      }
    },
    padding: {
      top: padding,
      bottom: bottomPadding,
      left: paddingLeft
    }
  });

  // annotate
  renderAnnotations(bindTag, chart);

  function renderAnnotations(bindTag, chart) {

    var unitTop = (chart.subtitles != '') ? 70 : 45; // Hard coded values for unitTop

    // annotate
    d3.select(bindTag + ' svg').append('text') // Title
      .attr('x', 20)
      .attr('y', 25)
      .style('font-size', '20px')
      .style('font-family', '"DaxlinePro", sans-serif')
      .style('fill', '#000000')
      .text(chart.title);

    if (chart.subtitle != '') {
      d3.select(bindTag + ' svg').append('text') // Subtitle
        .attr('x', 20)
        .attr('y', 45)
        .attr('text-anchor', 'left')
        .style('font-size', '15px')
        .style('font-family', '"Open Sans", sans-serif')
        .style('fill', '#999999')
        .text(chart.subtitle);
    }

    if (chart.unit && !rotate) {
      d3.select(bindTag + ' svg').append('text') // Unit (if non rotated)
        .attr('x', 20)
        .attr('y', unitTop)
        .attr('text-anchor', 'left')
        .style('font-size', '15px')
        .style('font-family', '"Open Sans", sans-serif')
        .style('fill', '#000000')
        .text(chart.unit);
    }

    var viewBoxHeight = d3.select(bindTag + ' svg').attr('height');
    var viewBoxWidth = d3.select(bindTag + ' svg').attr('width');

    if (chart.source != '') {
      d3.select(bindTag + ' svg').append('text') // Source
        .attr("transform", "translate(" + (viewBoxWidth) + "," + (viewBoxHeight + 200) + ")")
        .attr('text-anchor', 'end')
        .style('font-size', '12px')
        .style('font-family', '"Open Sans", sans-serif')
        .style('fill', '#999999')
        .text(chart.source);
    }
  }

  function checkType(chart) {
    if (chart.type === 'rotated') {
      type = 'bar';
      return type;
    } else if (chart.type === 'barline') {
      type = 'bar';
      return type;
    } else {
      return type = chart.type;
    }
  }


  function renderTimeseriesChartObject(bindTag, timechart) {
    var padding = 25;
    var chart = timechart //timeSubchart(timechart, period);

    // Create a dictionary so we can reverse lookup a tooltip label
    var dates_to_label = {};
    _.each(chart.timeSeries, function (data_point) {
      data_point.date = new Date(data_point.date);
      dates_to_label[data_point.date] = data_point.label;
    });

    // make room for titles if necessary
    if (chart.subtitle != '') {
      padding += 16;
    }
    if (chart.unit != '') {
      padding += 24;
    }

    // should we show
    var showPoints = true;
    if (chart.data.length > 100) {
      showPoints = false;
    }

    // work out position for chart legend
    var seriesCount = chart.series.length;
    var yOffset = (chart.legend == 'bottom-left' || chart.legend == 'bottom-right') ? seriesCount * 20 + 10 : 5;


    // refers to the issue of time axes not being applicable to non continuous charts
    var axisType;
    var keys;

    if (chart.type == 'line') { // continuous line charts
      axisType = {
        label: chart.xaxis,
        type: 'timeseries',
      }

      var monthsOnTimeline = (chart.timeSeries[chart.timeSeries.length - 1].date - chart.timeSeries[0].date) / (1000 * 60 * 60 * 24 * 30);
      var tick = {
        format: function (x) {
          return x.getFullYear();
        }
      }
      if (monthsOnTimeline <= 24.5) {
        tick = {
          format: function (x) {
            return formattedMonthYear(x);
          }
        }
      }


      axisType.tick = tick;
      keys = {
        x: 'date',
        value: chart.series
      }
    } else { // bar charts and other
      axisType = {
        label: chart.xaxis,
        type: 'category',
        categories: chart.categories
      }
      keys = {
        x: 'label',
        value: chart.series
      }
    }

    c3.generate({
      bindto: bindTag,

      data: {
        json: chart.timeSeries,
        keys: keys,
        type: chart.type,
        xFormat: '%Y-%m-%d %H:%M:%S'
      },

      point: {
        show: showPoints
      },

      legend: {
        hide: chart.hideLegend,
        position: 'inset',
        inset: {
          anchor: chart.legend,
          x: 10,
          y: yOffset
        }
      },

      axis: {
        x: axisType
      },
      tooltip: {
        format: {
          title: function (x) {
            return dates_to_label[x];
          }
        }
      },
      grid: {
        y: {
          show: true
        }
      },
      padding: {
        top: padding
      }
    });

    renderAnnotations(bindTag, chart);
  }

  function formattedMonthYear(date) {
    var monthNames = [
      "Jan", "Feb", "Mar",
      "Apr", "May", "Jun", "Jul",
      "Aug", "Sep", "Oct",
      "Nov", "Dec"];

    var monthIndex = date.getMonth();
    var year = date.getFullYear();

    return monthNames[monthIndex] + " " + year;
  }
}
{'fraction_non_alphanumeric': 0.15555394326344046, 'fraction_numerical': 0.01654211710077632, 'mean_word_length': 1.9123177688569617, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, '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': '131262', 'n_tokens_mistral': 4681, 'n_tokens_neox': 4358, 'n_words': 1062}