chartlabels-rails 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: fa8a64333f2e4d08eb1daac35fbb16ed73cb25b3398ab26c052640b442ff077c
+  data.tar.gz: 1c7a55fe488ea8dcb60e7ae619606916714fd1933592ee25f6f6a8a7a3650bd6
+SHA512:
+  metadata.gz: cf03052b0373c80d24bda4feafd4635068553f980be50e5924ef0bd7c0e5769f7ae817afcd20064e8a55dc6e2b762c049b9187cb1bbd51122e0b744cabb2db94
+  data.tar.gz: 33ef78ee65554c38058be9b9e3a2b1d28605abd9393ef6a3832b82026093e4cc1c91e449ba44e9744a510bb82a5fff36fb175f48ff3efde422cd4bb404649153

data/.gitignore

@@ -0,0 +1,6 @@
+/.bundle/
+/coverage/
+/doc/
+/pkg/
+/spec/reports/
+/tmp/

data/Gemfile

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+source "https://rubygems.org"
+
+# Specify your gem's dependencies in chartlabels-rails.gemspec
+gemspec
+
+gem "rake", "~> 13.0"
+
+gem "rubocop", "~> 0.81.0"

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2021 TODO: Write your name
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,29 @@
+# Chartlabels::Rails
+
+Welcome to your new gem! In this directory, you'll find the files you need to be able to package up your Ruby library into a gem. Put your Ruby code in the file `lib/chartlabels/rails`. To experiment with that code, run `bin/console` for an interactive prompt.
+
+TODO: Delete this and the text above, and describe your gem
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'chartlabels-rails'
+```
+
+And then execute:
+
+    $ bundle install
+
+Or install it yourself as:
+
+    $ gem install chartlabels-rails
+
+## Usage
+
+Visit [chartjs-plugin-label](https://github.com/emn178/chartjs-plugin-labels#usage)
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/Rakefile

@@ -0,0 +1,3 @@
+# frozen_string_literal: true
+
+require "bundler/gem_tasks"

data/chartlabels-rails.gemspec

@@ -0,0 +1,30 @@
+# frozen_string_literal: true
+
+require_relative "lib/chartlabels/version"
+
+Gem::Specification.new do |spec|
+  spec.name          = "chartlabels-rails"
+  spec.version       = Chartlabels::Rails::VERSION
+  spec.authors       = ["jared"]
+  spec.email         = ["jaredlamont90@gmail.com"]
+
+  spec.summary       = "chartjs plugin labels"
+  spec.homepage      = "https://github.com/internetsadboy/chartlabels-rails"
+  spec.license       = "MIT"
+  spec.required_ruby_version = Gem::Requirement.new(">= 2.3.0")
+
+  # Specify which files should be added to the gem when it is released.
+  # The `git ls-files -z` loads the files in the RubyGem that have been added into git.
+  spec.files = Dir.chdir(File.expand_path(__dir__)) do
+    `git ls-files -z`.split("\x0").reject { |f| f.match(%r{\A(?:test|spec|features)/}) }
+  end
+  spec.bindir        = "exe"
+  spec.executables   = spec.files.grep(%r{\Aexe/}) { |f| File.basename(f) }
+  spec.require_paths = ["lib"]
+
+  # Uncomment to register a new dependency of your gem
+  # spec.add_dependency "example-gem", "~> 1.0"
+
+  # For more information and examples about making a new gem, checkout our
+  # guide at: https://bundler.io/guides/creating_gem.html
+end

data/lib/chartlabels.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+require_relative "chartlabels/version"
+
+module Chartlabels
+  module Rails
+    class Engine < ::Rails::Engine; end
+  end
+end

data/lib/chartlabels/version.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+module Chartlabels
+  module Rails
+    VERSION = "0.1.0"
+  end
+end

data/vendor/assets/javascripts/chartjs-plugin-labels.js

@@ -0,0 +1,490 @@
+/**
+ * [chartjs-plugin-labels]{@link https://github.com/emn178/chartjs-plugin-labels}
+ *
+ * @version 1.1.0
+ * @author Chen, Yi-Cyuan [emn178@gmail.com]
+ * @copyright Chen, Yi-Cyuan 2017-2018
+ * @license MIT
+ */
+(function () {
+  'use strict';
+
+  if (typeof Chart === 'undefined') {
+    console.error('Can not find Chart object.');
+    return;
+  }
+
+  if (typeof Object.assign != 'function') {
+    Object.assign = function (target, varArgs) {
+      if (target == null) {
+        throw new TypeError('Cannot convert undefined or null to object');
+      }
+      var to = Object(target);
+      for (var index = 1; index < arguments.length; index++) {
+        var nextSource = arguments[index];
+        if (nextSource != null) {
+          for (var nextKey in nextSource) {
+            if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) {
+              to[nextKey] = nextSource[nextKey];
+            }
+          }
+        }
+      }
+      return to;
+    };
+  }
+
+  var SUPPORTED_TYPES = {};
+  ['pie', 'doughnut', 'polarArea', 'bar'].forEach(function (t) {
+    SUPPORTED_TYPES[t] = true;
+  });
+
+  function Label() {
+    this.renderToDataset = this.renderToDataset.bind(this);
+  }
+
+  Label.prototype.setup = function (chart, options) {
+    this.chart = chart;
+    this.ctx = chart.ctx;
+    this.args = {};
+    this.barTotal = {};
+    var chartOptions = chart.config.options;
+    this.options = Object.assign({
+      position: 'default',
+      precision: 0,
+      fontSize: chartOptions.defaultFontSize,
+      fontColor: chartOptions.defaultFontColor,
+      fontStyle: chartOptions.defaultFontStyle,
+      fontFamily: chartOptions.defaultFontFamily,
+      shadowOffsetX: 3,
+      shadowOffsetY: 3,
+      shadowColor: 'rgba(0,0,0,0.3)',
+      shadowBlur: 6,
+      images: [],
+      outsidePadding: 2,
+      textMargin: 2,
+      overlap: true
+    }, options);
+    if (chart.config.type === 'bar') {
+      this.options.position = 'default';
+      this.options.arc = false;
+      this.options.overlap = true;
+    }
+  };
+
+  Label.prototype.render = function () {
+    this.labelBounds = [];
+    this.chart.data.datasets.forEach(this.renderToDataset);
+  };
+
+  Label.prototype.renderToDataset = function (dataset, index) {
+    this.totalPercentage = 0;
+    this.total = null;
+    var arg = this.args[index];
+    arg.meta.data.forEach(function (element, index) {
+      this.renderToElement(dataset, arg, element, index);
+    }.bind(this));
+  };
+
+  Label.prototype.renderToElement = function (dataset, arg, element, index) {
+    if (!this.shouldRenderToElement(arg.meta, element)) {
+      return;
+    }
+    this.percentage = null;
+    var label = this.getLabel(dataset, element, index);
+    if (!label) {
+      return;
+    }
+    var ctx = this.ctx;
+    ctx.save();
+    ctx.font = Chart.helpers.fontString(this.options.fontSize, this.options.fontStyle, this.options.fontFamily);
+    var renderInfo = this.getRenderInfo(element, label);
+    if (!this.drawable(element, label, renderInfo)) {
+      ctx.restore();
+      return;
+    }
+    ctx.beginPath();
+    ctx.fillStyle = this.getFontColor(dataset, element, index);
+    this.renderLabel(label, renderInfo);
+    ctx.restore();
+  };
+
+  Label.prototype.renderLabel = function (label, renderInfo) {
+    return this.options.arc ? this.renderArcLabel(label, renderInfo) : this.renderBaseLabel(label, renderInfo);
+  };
+
+  Label.prototype.renderBaseLabel = function (label, position) {
+    var ctx = this.ctx;
+    if (typeof label === 'object') {
+      ctx.drawImage(label, position.x - label.width / 2, position.y - label.height / 2, label.width, label.height);
+    } else {
+      ctx.save();
+      ctx.textBaseline = 'top';
+      ctx.textAlign = 'center';
+
+      if (this.options.textShadow) {
+        ctx.shadowOffsetX = this.options.shadowOffsetX;
+        ctx.shadowOffsetY = this.options.shadowOffsetY;
+        ctx.shadowColor = this.options.shadowColor;
+        ctx.shadowBlur = this.options.shadowBlur;
+      }
+
+      var lines = label.split('\n');
+      for (var i = 0; i < lines.length; i++) {
+        var y = position.y - this.options.fontSize / 2 * lines.length + this.options.fontSize * i;
+        ctx.fillText(lines[i], position.x, y);
+      }
+      ctx.restore();
+    }
+  };
+
+  Label.prototype.renderArcLabel = function (label, renderInfo) {
+    var ctx = this.ctx, radius = renderInfo.radius, view = renderInfo.view;
+    ctx.save();
+    ctx.translate(view.x, view.y);
+    if (typeof label === 'string') {
+      ctx.rotate(renderInfo.startAngle);
+      ctx.textBaseline = 'middle';
+      ctx.textAlign = 'left';
+      var lines = label.split('\n'), max = 0, widths = [], offset = 0;
+      if (this.options.position === 'border') {
+        offset = (lines.length - 1) * this.options.fontSize / 2;
+      }
+      for (var j = 0; j < lines.length; ++j) {
+        var mertrics = ctx.measureText(lines[j]);
+        if (mertrics.width > max) {
+          max = mertrics.width;
+        }
+        widths.push(mertrics.width);
+      }
+      for (var j = 0; j < lines.length; ++j) {
+        var line = lines[j];
+        var y = (lines.length - 1 - j) * -this.options.fontSize + offset;
+        ctx.save();
+        var padding = (max - widths[j]) / 2;
+        ctx.rotate(padding / radius);
+        for (var i = 0; i < line.length; i++) {
+          var char = line.charAt(i);
+          mertrics = ctx.measureText(char);
+          ctx.save();
+          ctx.translate(0, -1 * radius);
+          ctx.fillText(char, 0, y);
+          ctx.restore();
+          ctx.rotate(mertrics.width / radius);
+        }
+        ctx.restore();
+      }
+    } else {
+      ctx.rotate((view.startAngle + Math.PI / 2 + renderInfo.endAngle) / 2);
+      ctx.translate(0, -1 * radius);
+      this.renderLabel(label, { x: 0, y: 0 });
+    }
+    ctx.restore();
+  };
+
+  Label.prototype.shouldRenderToElement = function (meta, element) {
+    return !meta.hidden && !element.hidden && (
+      this.options.showZero ||
+      this.chart.config.type === 'polarArea' ? element._view.outerRadius !== 0 : element._view.circumference !== 0
+    );
+  };
+
+  Label.prototype.getLabel = function (dataset, element, index) {
+    var label;
+    if (typeof this.options.render === 'function') {
+      label = this.options.render({
+        label: this.chart.config.data.labels[index],
+        value: dataset.data[index],
+        percentage: this.getPercentage(dataset, element, index),
+        dataset: dataset,
+        index: index
+      });
+    } else {
+      switch (this.options.render) {
+        case 'value':
+          label = dataset.data[index];
+          break;
+        case 'label':
+          label = this.chart.config.data.labels[index];
+          break;
+        case 'image':
+          label = this.options.images[index] ? this.loadImage(this.options.images[index]) : '';
+          break;
+        case 'percentage':
+        default:
+          label = this.getPercentage(dataset, element, index) + '%';
+          break;
+      }
+    }
+    if (typeof label === 'object') {
+      label = this.loadImage(label);
+    } else if (label !== null && label !== undefined) {
+      label = label.toString();
+    }
+    return label;
+  };
+
+  Label.prototype.getFontColor = function (dataset, element, index) {
+    var fontColor = this.options.fontColor;
+    if (typeof fontColor === 'function') {
+      fontColor = fontColor({
+        label: this.chart.config.data.labels[index],
+        value: dataset.data[index],
+        percentage: this.getPercentage(dataset, element, index),
+        backgroundColor: dataset.backgroundColor[index],
+        dataset: dataset,
+        index: index
+      });
+    } else if (typeof fontColor !== 'string') {
+      fontColor = fontColor[index] || this.chart.config.options.defaultFontColor;
+    }
+    return fontColor;
+  };
+
+  Label.prototype.getPercentage = function (dataset, element, index) {
+    if (this.percentage !== null) {
+      return this.percentage;
+    }
+    var percentage;
+    if (this.chart.config.type === 'polarArea') {
+      if (this.total === null) {
+        this.total = 0;
+        for (var i = 0;i < dataset.data.length; ++i) {
+          this.total += dataset.data[i];
+        }
+      }
+      percentage = dataset.data[index] / this.total * 100;
+    } else if (this.chart.config.type === 'bar') {
+      if (this.barTotal[index] === undefined) {
+        this.barTotal[index] = 0;
+        for (var i = 0;i < this.chart.data.datasets.length; ++i) {
+          this.barTotal[index] += this.chart.data.datasets[i].data[index];
+        }
+      }
+      percentage = dataset.data[index] / this.barTotal[index] * 100;
+    } else {
+      percentage = element._view.circumference / this.chart.config.options.circumference * 100;
+    }
+    percentage = parseFloat(percentage.toFixed(this.options.precision));
+    if (!this.options.showActualPercentages) {
+      if (this.chart.config.type === 'bar') {
+        this.totalPercentage = this.barTotalPercentage[index] || 0;
+      }
+      this.totalPercentage += percentage;
+      if (this.totalPercentage > 100) {
+        percentage -= this.totalPercentage - 100;
+        percentage = parseFloat(percentage.toFixed(this.options.precision));
+      }
+      if (this.chart.config.type === 'bar') {
+        this.barTotalPercentage[index] = this.totalPercentage
+      }
+    }
+    this.percentage = percentage;
+    return percentage;
+  };
+
+  Label.prototype.getRenderInfo = function (element, label) {
+    if (this.chart.config.type === 'bar') {
+      return this.getBarRenderInfo(element, label);
+    } else {
+      return this.options.arc ? this.getArcRenderInfo(element, label) : this.getBaseRenderInfo(element, label);
+    }
+  };
+
+  Label.prototype.getBaseRenderInfo = function (element, label) {
+    if (this.options.position === 'outside' || this.options.position === 'border') {
+      var renderInfo, rangeFromCentre,
+        view = element._view,
+        centreAngle = view.startAngle + (view.endAngle - view.startAngle) / 2,
+        innerRadius = view.outerRadius / 2;
+      if (this.options.position === 'border') {
+        rangeFromCentre = (view.outerRadius - innerRadius) / 2 + innerRadius;
+      } else if (this.options.position === 'outside') {
+        rangeFromCentre = (view.outerRadius - innerRadius) + innerRadius + this.options.textMargin;
+      }
+      renderInfo = {
+        x: view.x + (Math.cos(centreAngle) * rangeFromCentre),
+        y: view.y + (Math.sin(centreAngle) * rangeFromCentre)
+      };
+      if (this.options.position === 'outside') {
+        var offset = this.options.textMargin + this.measureLabel(label).width / 2;
+        renderInfo.x += renderInfo.x < view.x ? -offset : offset;
+      }
+      return renderInfo;
+    } else {
+      return element.tooltipPosition();
+    }
+  };
+
+  Label.prototype.getArcRenderInfo = function (element, label) {
+    var radius, view = element._view;
+    if (this.options.position === 'outside') {
+      radius = view.outerRadius + this.options.fontSize + this.options.textMargin;
+    } else if (this.options.position === 'border') {
+      radius = (view.outerRadius / 2 + view.outerRadius) / 2;
+    } else {
+      radius = (view.innerRadius + view.outerRadius) / 2;
+    }
+    var startAngle = view.startAngle, endAngle = view.endAngle;
+    var totalAngle = endAngle - startAngle;
+    startAngle += Math.PI / 2;
+    endAngle += Math.PI / 2;
+    var mertrics = this.measureLabel(label);
+    startAngle += (endAngle - (mertrics.width / radius + startAngle)) / 2;
+    return {
+      radius: radius,
+      startAngle: startAngle,
+      endAngle: endAngle,
+      totalAngle: totalAngle,
+      view: view
+    }
+  };
+
+  Label.prototype.getBarRenderInfo = function (element, label) {
+    var renderInfo = element.tooltipPosition();
+    renderInfo.y -= this.measureLabel(label).height / 2 + this.options.textMargin;
+    return renderInfo;
+  };
+
+  Label.prototype.drawable = function (element, label, renderInfo) {
+    if (this.options.overlap) {
+      return true;
+    } else if (this.options.arc) {
+      return renderInfo.endAngle - renderInfo.startAngle <= renderInfo.totalAngle;
+    } else {
+      var mertrics = this.measureLabel(label),
+        left = renderInfo.x - mertrics.width / 2,
+        right = renderInfo.x + mertrics.width / 2,
+        top = renderInfo.y - mertrics.height / 2,
+        bottom = renderInfo.y + mertrics.height / 2;
+      if (this.options.renderInfo === 'outside') {
+        return this.outsideInRange(left, right, top, bottom);
+      } else {
+        return element.inRange(left, top) && element.inRange(left, bottom) &&
+          element.inRange(right, top) && element.inRange(right, bottom);
+      }
+    }
+  };
+
+  Label.prototype.outsideInRange = function (left, right, top, bottom) {
+    var labelBounds = this.labelBounds;
+    for (var i = 0;i < labelBounds.length;++i) {
+      var bound = labelBounds[i];
+      var potins = [
+        [left, top],
+        [left, bottom],
+        [right, top],
+        [right, bottom]
+      ];
+      for (var j = 0;j < potins.length;++j) {
+        var x = potins[j][0];
+        var y = potins[j][1];
+        if (x >= bound.left && x <= bound.right && y >= bound.top && y <= bound.bottom) {
+          return false;
+        }
+      }
+      potins = [
+        [bound.left, bound.top],
+        [bound.left, bound.bottom],
+        [bound.right, bound.top],
+        [bound.right, bound.bottom]
+      ];
+      for (var j = 0;j < potins.length;++j) {
+        var x = potins[j][0];
+        var y = potins[j][1];
+        if (x >= left && x <= right && y >= top && y <= bottom) {
+          return false;
+        }
+      }
+    }
+    labelBounds.push({
+      left: left,
+      right: right,
+      top: top,
+      bottom: bottom
+    });
+    return true;
+  };
+
+  Label.prototype.measureLabel = function (label) {
+    if (typeof label === 'object') {
+      return { width: label.width, height: label.height };
+    } else {
+      var width = 0;
+      var lines = label.split('\n');
+      for (var i = 0; i < lines.length; ++i) {
+        var result = this.ctx.measureText(lines[i]);
+        if (result.width > width) {
+          width = result.width;
+        }
+      }
+      return { width: width, height: this.options.fontSize * lines.length };
+    }
+  };
+
+  Label.prototype.loadImage = function (obj) {
+    var image = new Image();
+    image.src = obj.src;
+    image.width = obj.width;
+    image.height = obj.height;
+    return image;
+  };
+
+  Chart.plugins.register({
+    id: 'labels',
+    beforeDatasetsUpdate: function (chart, options) {
+      if (!SUPPORTED_TYPES[chart.config.type]) {
+        return;
+      }
+      if (!Array.isArray(options)) {
+        options = [options];
+      }
+      var count = options.length;
+      if (!chart._labels || count !== chart._labels.length) {
+        chart._labels = options.map(function () {
+          return new Label();
+        });
+      }
+      var someOutside = false, maxPadding = 0;
+      for (var i = 0; i < count; ++i) {
+        var label = chart._labels[i];
+        label.setup(chart, options[i]);
+        if (label.options.position === 'outside') {
+          someOutside = true;
+          var padding = label.options.fontSize * 1.5 + label.options.outsidePadding;
+          if (padding > maxPadding) {
+            maxPadding = padding;
+          }
+        }
+      }
+      if (someOutside) {
+        chart.chartArea.top += maxPadding;
+        chart.chartArea.bottom -= maxPadding;
+      }
+    },
+    afterDatasetUpdate: function (chart, args, options) {
+      if (!SUPPORTED_TYPES[chart.config.type]) {
+        return;
+      }
+      chart._labels.forEach(function (label) {
+        label.args[args.index] = args;
+      });
+    },
+    beforeDraw: function (chart) {
+      if (!SUPPORTED_TYPES[chart.config.type]) {
+        return;
+      }
+      chart._labels.forEach(function (label) {
+        label.barTotalPercentage = {};
+      });
+    },
+    afterDatasetsDraw: function (chart) {
+      if (!SUPPORTED_TYPES[chart.config.type]) {
+        return;
+      }
+      chart._labels.forEach(function (label) {
+        label.render();
+      });
+    }
+  });
+})();

metadata

@@ -0,0 +1,52 @@
+--- !ruby/object:Gem::Specification
+name: chartlabels-rails
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- jared
+autorequire:
+bindir: exe
+cert_chain: []
+date: 2021-02-08 00:00:00.000000000 Z
+dependencies: []
+description:
+email:
+- jaredlamont90@gmail.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- ".gitignore"
+- Gemfile
+- LICENSE.txt
+- README.md
+- Rakefile
+- chartlabels-rails.gemspec
+- lib/chartlabels.rb
+- lib/chartlabels/version.rb
+- vendor/assets/javascripts/chartjs-plugin-labels.js
+homepage: https://github.com/internetsadboy/chartlabels-rails
+licenses:
+- MIT
+metadata: {}
+post_install_message:
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: 2.3.0
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.2.6
+signing_key:
+specification_version: 4
+summary: chartjs plugin labels
+test_files: []