c3 - npm Package Compare versions

Comparing version 0.4.8 to 0.4.9

bower.json

@@ -7,3 +7,3 @@ {
   ],
-  "version": "0.4.8",
+  "version": "0.4.9",
   "homepage": "https://github.com/masayuki0812/c3",
@@ -23,8 +23,12 @@ "authors": [
     "bower_components",
-    "test",
-    "tests"
+    "htdocs",
+    "spec",
+    "src",
+    "package.json",
+    "component.json",
+    "Gruntfile.*"
   ],
   "dependencies": {
-    "d3": "~3.5.3"
+    "d3": "<=3.5.0"
   }
 }

component.json

@@ -5,6 +5,6 @@ {
   "description": "A D3-based reusable chart library",
-  "version": "0.4.8",
+  "version": "0.4.9",
   "keywords": [],
   "dependencies": {
-    "mbostock/d3": "v3.5.3"
+    "mbostock/d3": "v3.5.0"
   },
@@ -11,0 +11,0 @@ "development": {},

package.json

 {
   "name": "c3",
-  "version": "0.4.8",
+  "version": "0.4.9",
   "description": "D3-based reusable chart library",
@@ -23,3 +23,3 @@ "main": "c3.js",
   "dependencies": {
-    "d3": "~3.5.3"
+    "d3": "<=3.5.0"
   },
@@ -31,3 +31,3 @@ "devDependencies": {
     "grunt-contrib-jasmine": "~0.8.0",
-    "grunt-contrib-jshint": "~0.7.1",
+    "grunt-contrib-jshint": "~0.10.0",
     "grunt-contrib-uglify": "~0.4.0",
@@ -34,0 +34,0 @@ "grunt-contrib-watch": "^0.6.1",

README.md

@@ -1,2 +0,2 @@
-c3 [![Build Status](https://travis-ci.org/masayuki0812/c3.svg?branch=master)](https://travis-ci.org/masayuki0812/c3)
+c3 [![Build Status](https://travis-ci.org/masayuki0812/c3.svg?branch=master)](https://travis-ci.org/masayuki0812/c3) [![Dependency Status](https://david-dm.org/masayuki0812/c3.svg)](https://david-dm.org/masayuki0812/c3) [![devDependency Status](https://david-dm.org/masayuki0812/c3/dev-status.svg)](https://david-dm.org/masayuki0812/c3#info=devDependencies) [![license](http://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat)](https://github.com/masayuki0812/c3/blob/master/LICENSE)
 ==
@@ -45,2 +45,5 @@
 
+## Dependency
++ [D3.js](https://github.com/mbostock/d3) `<=3.5.0`
+
 ## License
@@ -47,0 +50,0 @@ MIT

spec/api.data-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 api data', function () {

spec/api.focus-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 api load', function () {

spec/api.grid-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 api grid', function () {

spec/api.load-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 api load', function () {

spec/api.zoom-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 api zoom', function () {

spec/arc-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 chart axis', function () {

spec/axis-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -383,7 +379,6 @@ describe('c3 chart axis', function () {
                             'long tick text',
-                            'on category',
-                            'axis',
+                            'on category axis'
                         ],
                         expectedX = '0';
-                    expect(tspans.size()).toBe(4);
+                    expect(tspans.size()).toBe(3);
                     tspans.each(function (d, i) {
@@ -701,3 +696,3 @@ var tspan = d3.select(this);
                 tickTexts = chart.internal.main.selectAll('.c3-axis-y g.tick text');
-            expect(paddingLeft).toBe(50);
+            expect(paddingLeft).toBeGreaterThan(19);
             tickTexts.each(function () {
@@ -747,3 +742,3 @@ expect(+d3.select(this).attr('x')).toBeLessThan(0);
                 tickTexts = chart.internal.main.selectAll('.c3-axis-2y g.tick text');
-            expect(paddingRight).toBeGreaterThan(39);
+            expect(paddingRight).toBeGreaterThan(19);
             tickTexts.each(function () {
@@ -750,0 +745,0 @@ expect(+d3.select(this).attr('x')).toBeGreaterThan(0);

spec/c3-spec.js

@@ -1,4 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it;
 
@@ -5,0 +2,0 @@ describe('c3', function () {

spec/class-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 chart class', function () {

spec/core-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 chart', function () {

spec/data-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 chart data', function () {

spec/domain-spec.js

@@ -1,7 +0,3 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
-describe('c3 chart axis', function () {
+describe('c3 chart domain', function () {
     'use strict';
@@ -8,0 +4,0 @@

spec/grid-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -86,2 +82,40 @@ describe('c3 chart grid', function () {
 
+        describe('with padding.top', function () {
+
+            it('should have correct height', function () {
+                args = {
+                    data: {
+                        columns: [
+                            ['data1', 30, 200, 100, 400],
+                        ]
+                    },
+                    grid: {
+                        x: {
+                            lines: [
+                                {value: 3, text: 'Label 3'}
+                            ]
+                        }
+                    },
+                    padding: {
+                        top: 50
+                    }
+                };
+                expect(true).toBeTruthy();
+            });
+
+            it('should show x grid lines', function () {
+                var lines = chart.internal.main.select('.c3-xgrid-lines .c3-xgrid-line'),
+                    expectedX1 = 593,
+                    expectedText = ['Label 3'];
+                lines.each(function (id, i) {
+                    var line = d3.select(this),
+                        l = line.select('line'),
+                        t = line.select('text');
+                    expect(+l.attr('x1')).toBeCloseTo(expectedX1, -2);
+                    expect(t.text()).toBe(expectedText[i]);
+                });
+            });
+
+        });
+
         describe('on category axis', function () {
@@ -123,3 +157,3 @@
                         t = line.select('text');
-                    expect(+l.attr('x1')).toBeCloseTo(expectedX1[i], -1);
+                    expect(+l.attr('x1')).toBeCloseTo(expectedX1[i], -2);
                     expect(t.text()).toBe(expectedText[i]);
@@ -126,0 +160,0 @@ });

spec/interaction-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -49,4 +45,4 @@ describe('c3 chart interaction', function () {
                     var box = d3.select(this).node().getBoundingClientRect();
-                    expect(box.left).toBe(lefts[i]);
-                    expect(box.width).toBe(widths[i]);
+                    expect(box.left).toBeCloseTo(lefts[i], -2);
+                    expect(box.width).toBeCloseTo(widths[i], -2);
                 });
@@ -74,4 +70,4 @@ });
                     var box = d3.select(this).node().getBoundingClientRect();
-                    expect(box.left).toBe(40.5);
-                    expect(box.width).toBe(598);
+                    expect(box.left).toBeCloseTo(40.5, -2);
+                    expect(box.width).toBeCloseTo(598, -2);
                 });
@@ -101,4 +97,4 @@ });
                     var box = d3.select(this).node().getBoundingClientRect();
-                    expect(box.left).toBe(lefts[i]);
-                    expect(box.width).toBe(widths[i]);
+                    expect(box.left).toBeCloseTo(lefts[i], -2);
+                    expect(box.width).toBeCloseTo(widths[i], -2);
                 });
@@ -126,4 +122,4 @@
                     var box = d3.select(this).node().getBoundingClientRect();
-                    expect(box.left).toBe(40.5);
-                    expect(box.width).toBe(598);
+                    expect(box.left).toBeCloseTo(40.5, -2);
+                    expect(box.width).toBeCloseTo(598, -2);
                 });
@@ -130,0 +126,0 @@ });

spec/legend-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -59,3 +55,3 @@ describe('c3 chart legend', function () {
             expect(box.top).toBe(5.5);
-            expect(box.left).toBe(60.5);
+            expect(box.left).toBeGreaterThan(30);
         });
@@ -62,0 +58,0 @@

spec/shape.bar-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ var setMouseEvent = window.setMouseEvent;

spec/shape.line-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 chart shape line', function () {

spec/tooltip-spec.js

@@ -1,7 +0,3 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    jasmine = window.jasmine,
-    beforeAll = window.beforeAll,
-    beforeEach = window.beforeEach;
+var jasmine = window.jasmine,
+    beforeAll = window.beforeAll;
 
@@ -47,5 +43,5 @@ describe('c3 chart tooltip', function () {
                     topExpected = 115,
-                    leftExpected = 307;
+                    leftExpected = 280;
                 expect(top).toBe(topExpected);
-                expect(left).toBe(leftExpected);
+                expect(left).toBeGreaterThan(leftExpected);
             });
@@ -70,5 +66,5 @@
                     topExpected = 115,
-                    leftExpected = 307;
+                    leftExpected = 280;
                 expect(top).toBe(topExpected);
-                expect(left).toBe(leftExpected);
+                expect(left).toBeGreaterThan(leftExpected);
             });
@@ -75,0 +71,0 @@

spec/type-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 chart types', function () {

spec/zoom-spec.js

@@ -1,5 +0,1 @@
-var describe = window.describe,
-    expect = window.expect,
-    it = window.it,
-    beforeEach = window.beforeEach;
 
@@ -6,0 +2,0 @@ describe('c3 chart zoom', function () {

src/api.chart.js

@@ -15,7 +15,14 @@ c3_chart_fn.resize = function (size) {
     var $$ = this.internal;
-    $$.data.targets = undefined;
-    $$.data.xs = {};
-    $$.selectChart.classed('c3', false).html("");
+
     window.clearInterval($$.intervalForObserveInserted);
     window.onresize = null;
+
+    $$.selectChart.classed('c3', false).html("");
+
+    // MEMO: this is needed because the reference of some elements will not be released, then memory leak will happen.
+    Object.keys($$).forEach(function (key) {
+        $$[key] = null;
+    });
+
+    return null;
 };

src/api.transform.js

@@ -14,3 +14,4 @@ c3_chart_fn.transform = function (type, targetIds) {
     $$.setTargetType(targetIds, type);
+    $$.updateTargets($$.data.targets); // this is needed when transforming to arc
     $$.updateAndRedraw(options);
 };

src/axis.js

@@ -33,3 +33,3 @@ c3_chart_internal_fn.initAxis = function () {
 };
-c3_chart_internal_fn.getXAxis = function (scale, orient, tickFormat, tickValues, withOuterTick) {
+c3_chart_internal_fn.getXAxis = function (scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition) {
     var $$ = this, config = $$.config,
@@ -40,3 +40,4 @@ axisParams = {
             tickMultiline: config.axis_x_tick_multiline,
-            tickWidth: config.axis_x_tick_width
+            tickWidth: config.axis_x_tick_width,
+            withoutTransition: withoutTransition,
         },
@@ -68,2 +69,15 @@ axis = c3_axis($$.d3, axisParams).scale(scale).orient(orient);
 };
+c3_chart_internal_fn.updateXAxisTickValues = function (targets, axis) {
+    var $$ = this, config = $$.config, tickValues;
+    if (config.axis_x_tick_fit || config.axis_x_tick_count) {
+        tickValues = $$.generateTickValues($$.mapTargetsToUniqueXs(targets), config.axis_x_tick_count, $$.isTimeSeries());
+    }
+    if (axis) {
+        axis.tickValues(tickValues);
+    } else {
+        $$.xAxis.tickValues(tickValues);
+        $$.subXAxis.tickValues(tickValues);
+    }
+    return tickValues;
+};
 c3_chart_internal_fn.getYAxis = function (scale, orient, tickFormat, tickValues, withOuterTick) {
@@ -272,3 +286,3 @@ var axisParams = {withOuterTick: withOuterTick},
     var $$ = this, config = $$.config,
-        maxWidth = 0, targetsToShow, scale, axis;
+        maxWidth = 0, targetsToShow, scale, axis, body, svg;
     if (withoutRecompute && $$.currentMaxTickWidths[id]) {
@@ -288,9 +302,17 @@ return $$.currentMaxTickWidths[id];
             axis = $$.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues);
+            $$.updateXAxisTickValues(targetsToShow, axis);
         }
-        $$.d3.select('body').append("g").style('visibility', 'hidden').call(axis).each(function () {
+        body = this.d3.select('body').classed('c3', true);
+        svg = body.append('svg').style('visibility', 'hidden');
+        svg.append('g').call(axis).each(function () {
             $$.d3.select(this).selectAll('text tspan').each(function () {
                 var box = this.getBoundingClientRect();
-                if (box.left > 0 && maxWidth < box.width) { maxWidth = box.width; }
+                if (box.left >= 0 && maxWidth < box.width) { maxWidth = box.width; }
             });
-        }).remove();
+        });
+        // TODO: time lag to get maxWidth
+        window.setTimeout(function () {
+            svg.remove();
+        }, 100);
+        body.classed('c3', false);
     }
@@ -297,0 +319,0 @@ $$.currentMaxTickWidths[id] = maxWidth <= 0 ? $$.currentMaxTickWidths[id] : maxWidth;

src/color.js

@@ -9,3 +9,3 @@ c3_chart_internal_fn.generateColor = function () {
     return function (d) {
-        var id = d.id || d, color;
+        var id = d.id || (d.data && d.data.id) || d, color;
 
@@ -12,0 +12,0 @@ // if callback function is provided

src/config.js

@@ -23,2 +23,3 @@ c3_chart_internal_fn.getDefaultConfig = function () {
         oninit: function () {},
+        onrendered: function () {},
         transition_duration: 350,
@@ -48,2 +49,3 @@ data_x: undefined,
         data_selection_multiple: true,
+        data_selection_draggable: false,
         data_onclick: function () {},
@@ -54,4 +56,2 @@ data_onmouseover: function () {},
         data_onunselected: function () {},
-        data_ondragstart: function () {},
-        data_ondragend: function () {},
         data_url: undefined,
@@ -111,2 +111,3 @@ data_json: undefined,
         axis_y_min: undefined,
+        axis_y_inverted: false,
         axis_y_center: undefined,
@@ -126,2 +127,3 @@ axis_y_inner: undefined,
         axis_y2_min: undefined,
+        axis_y2_inverted: false,
         axis_y2_center: undefined,
@@ -128,0 +130,0 @@ axis_y2_inner: undefined,

src/core.js

@@ -1,2 +0,2 @@
-var c3 = { version: "0.4.8" };
+var c3 = { version: "0.4.9" };
 
@@ -397,3 +397,3 @@ var c3_chart_fn, c3_chart_internal_fn;
 c3_chart_internal_fn.updateTargets = function (targets) {
-    var $$ = this, config = $$.config;
+    var $$ = this;
 
@@ -412,10 +412,15 @@ /*-- Main --*/
     //-- Arc --//
-    if ($$.updateTargetsForArc) { $$.updateTargetsForArc(targets); }
+    if ($$.hasArcType() && $$.updateTargetsForArc) { $$.updateTargetsForArc(targets); }
+
+    /*-- Sub --*/
+
     if ($$.updateTargetsForSubchart) { $$.updateTargetsForSubchart(targets); }
 
-    /*-- Show --*/
-
     // Fade-in each chart
+    $$.showTargets();
+};
+c3_chart_internal_fn.showTargets = function () {
+    var $$ = this;
     $$.svg.selectAll('.' + CLASS.target).filter(function (d) { return $$.isTargetToShow(d.id); })
-      .transition().duration(config.transition_duration)
+      .transition().duration($$.config.transition_duration)
         .style("opacity", 1);
@@ -475,9 +480,3 @@ };
         if (!config.axis_x_tick_values) {
-            if (config.axis_x_tick_fit || config.axis_x_tick_count) {
-                tickValues = $$.generateTickValues($$.mapTargetsToUniqueXs(targetsToShow), config.axis_x_tick_count, $$.isTimeSeries());
-            } else {
-                tickValues = undefined;
-            }
-            $$.xAxis.tickValues(tickValues);
-            $$.subXAxis.tickValues(tickValues);
+            tickValues = $$.updateXAxisTickValues(targetsToShow);
         }
@@ -557,18 +556,18 @@ } else {
     // grid
-    $$.redrawGrid(duration);
+    $$.updateGrid(duration);
 
     // rect for regions
-    $$.redrawRegion(duration);
+    $$.updateRegion(duration);
 
     // bars
-    $$.redrawBar(durationForExit);
+    $$.updateBar(durationForExit);
 
     // lines, areas and cricles
-    $$.redrawLine(durationForExit);
-    $$.redrawArea(durationForExit);
-    $$.redrawCircle();
+    $$.updateLine(durationForExit);
+    $$.updateArea(durationForExit);
+    $$.updateCircle();
 
     // text
     if ($$.hasDataLabel()) {
-        $$.redrawText(durationForExit);
+        $$.updateText(durationForExit);
     }
@@ -603,36 +602,62 @@
 
-    // transition should be derived from one transition
-    d3.transition().duration(duration).each(function () {
-        var transitions = [];
+    if (options.flow) {
+        flow = $$.generateFlow({
+            targets: targetsToShow,
+            flow: options.flow,
+            duration: duration,
+            drawBar: drawBar,
+            drawLine: drawLine,
+            drawArea: drawArea,
+            cx: cx,
+            cy: cy,
+            xv: xv,
+            xForText: xForText,
+            yForText: yForText
+        });
+    }
 
-        $$.addTransitionForBar(transitions, drawBar);
-        $$.addTransitionForLine(transitions, drawLine);
-        $$.addTransitionForArea(transitions, drawArea);
-        $$.addTransitionForCircle(transitions, cx, cy);
-        $$.addTransitionForText(transitions, xForText, yForText, options.flow);
-        $$.addTransitionForRegion(transitions);
-        $$.addTransitionForGrid(transitions);
+    if (duration) {
+        // transition should be derived from one transition
+        d3.transition().duration(duration).each(function () {
+            var transitionsToWait = [];
 
-        // Wait for end of transitions if called from flow API
-        if (options.flow) {
+            // redraw and gather transitions
+            [
+                $$.redrawBar(drawBar, true),
+                $$.redrawLine(drawLine, true),
+                $$.redrawArea(drawArea, true),
+                $$.redrawCircle(cx, cy, true),
+                $$.redrawText(xForText, yForText, options.flow, true),
+                $$.redrawRegion(true),
+                $$.redrawGrid(true),
+            ].forEach(function (transitions) {
+                transitions.forEach(function (transition) {
+                    transitionsToWait.push(transition);
+                });
+            });
+
+            // Wait for end of transitions to call flow and onrendered callback
             waitForDraw = $$.generateWait();
-            transitions.forEach(function (t) {
+            transitionsToWait.forEach(function (t) {
                 waitForDraw.add(t);
             });
-            flow = $$.generateFlow({
-                targets: targetsToShow,
-                flow: options.flow,
-                duration: duration,
-                drawBar: drawBar,
-                drawLine: drawLine,
-                drawArea: drawArea,
-                cx: cx,
-                cy: cy,
-                xv: xv,
-                xForText: xForText,
-                yForText: yForText
-            });
+        })
+        .call(waitForDraw, function () {
+            if (flow) {
+                flow();
+            }
+            if (config.onrendered) {
+                config.onrendered.call($$);
+            }
+        });
+    }
+    else {
+        $$.redrawBar(drawBar);
+        $$.redrawLine(drawLine);
+        $$.redrawArea(drawArea);
+        $$.redrawCircle(cx, cy);
+        if (config.onrendered) {
+            config.onrendered.call($$);
         }
-    })
-    .call(waitForDraw || function () {}, flow || function () {});
+    }
 
@@ -639,0 +664,0 @@ // update fadein condition

src/domain.js

@@ -69,18 +69,15 @@ c3_chart_internal_fn.getYDomainMin = function (targets) {
         yMax = axisId === 'y2' ? config.axis_y2_max : config.axis_y_max,
-        yDomainMin = isValue(yMin) ? yMin : $$.getYDomainMin(yTargets),
-        yDomainMax = isValue(yMax) ? yMax : $$.getYDomainMax(yTargets),
-        domainLength, padding, padding_top, padding_bottom,
+        yDomainMin = $$.getYDomainMin(yTargets),
+        yDomainMax = $$.getYDomainMax(yTargets),
+        domain, domainLength, padding, padding_top, padding_bottom,
         center = axisId === 'y2' ? config.axis_y2_center : config.axis_y_center,
         yDomainAbs, lengths, diff, ratio, isAllPositive, isAllNegative,
         isZeroBased = ($$.hasType('bar', yTargets) && config.bar_zerobased) || ($$.hasType('area', yTargets) && config.area_zerobased),
+        isInverted = axisId === 'y2' ? config.axis_y2_inverted : config.axis_y_inverted,
         showHorizontalDataLabel = $$.hasDataLabel() && config.axis_rotated,
         showVerticalDataLabel = $$.hasDataLabel() && !config.axis_rotated;
 
-    if (yDomainMax < yDomainMin) {
-        if (isValue(yMin)) {
-            yDomainMax = yDomainMin + 10; // TODO: introduce axis.y.maxMin
-        } else {
-            yDomainMin = yDomainMax - 10; // TODO: introduce axis.y.minMax
-        }
-    }
+    // MEMO: avoid inverting domain unexpectedly
+    yDomainMin = isValue(yMin) ? yMin : isValue(yMax) ? (yDomainMin < yMax ? yDomainMin : yMax - 10) : yDomainMin;
+    yDomainMax = isValue(yMax) ? yMax : isValue(yMin) ? (yMin < yDomainMax ? yDomainMax : yMin + 10) : yDomainMax;
 
@@ -146,3 +143,4 @@ if (yTargets.length === 0) { // use current domain if target of axisId is none
     }
-    return [yDomainMin - padding_bottom, yDomainMax + padding_top];
+    domain = [yDomainMin - padding_bottom, yDomainMax + padding_top];
+    return isInverted ? domain.reverse() : domain;
 };
@@ -149,0 +147,0 @@ c3_chart_internal_fn.getXDomainMin = function (targets) {

src/drag.js

@@ -68,3 +68,2 @@ c3_chart_internal_fn.drag = function (mouse) {
     $$.dragging = true;
-    $$.config.data_ondragstart.call($$.api);
 };
@@ -83,4 +82,2 @@
     $$.dragging = false;
-    $$.config.data_ondragend.call($$.api);
 };
-

src/grid.js

@@ -73,3 +73,3 @@ c3_chart_internal_fn.initGrid = function () {
 
-c3_chart_internal_fn.redrawGrid = function (duration) {
+c3_chart_internal_fn.updateGrid = function (duration) {
     var $$ = this, main = $$.main, config = $$.config,
@@ -95,3 +95,3 @@ xgridLine, ygridLine, yv;
         .attr("transform", config.axis_rotated ? "" : "rotate(-90)")
-        .attr('dx', config.axis_rotated ? 0 : -$$.margin.top)
+        .attr('dx', -4)
         .attr('dy', -5)
@@ -143,15 +143,19 @@ .style("opacity", 0);
 };
-c3_chart_internal_fn.addTransitionForGrid = function (transitions) {
-    var $$ = this, config = $$.config, xv = $$.xv.bind($$);
-    transitions.push($$.xgridLines.select('line').transition()
-                     .attr("x1", config.axis_rotated ? 0 : xv)
-                     .attr("x2", config.axis_rotated ? $$.width : xv)
-                     .attr("y1", config.axis_rotated ? xv : $$.margin.top)
-                     .attr("y2", config.axis_rotated ? xv : $$.height)
-                     .style("opacity", 1));
-    transitions.push($$.xgridLines.select('text').transition()
-                     .attr("x", config.axis_rotated ? $$.width : 0)
-                     .attr("y", xv)
-                     .text(function (d) { return d.text; })
-                     .style("opacity", 1));
+c3_chart_internal_fn.redrawGrid = function (withTransition) {
+    var $$ = this, config = $$.config, xv = $$.xv.bind($$),
+        lines = $$.xgridLines.select('line'),
+        texts = $$.xgridLines.select('text');
+    return [
+        (withTransition ? lines.transition() : lines)
+            .attr("x1", config.axis_rotated ? 0 : xv)
+            .attr("x2", config.axis_rotated ? $$.width : xv)
+            .attr("y1", config.axis_rotated ? xv : 0)
+            .attr("y2", config.axis_rotated ? xv : $$.height)
+            .style("opacity", 1),
+        (withTransition ? texts.transition() : texts)
+            .attr("x", config.axis_rotated ? $$.width : 0)
+            .attr("y", xv)
+            .text(function (d) { return d.text; })
+            .style("opacity", 1)
+    ];
 };
@@ -158,0 +162,0 @@ c3_chart_internal_fn.showXGridFocus = function (selectedData) {

src/interaction.js

@@ -234,6 +234,8 @@ c3_chart_internal_fn.initEventRect = function () {
         .call(
-            d3.behavior.drag().origin(Object)
-                .on('drag', function () { $$.drag(d3.mouse(this)); })
-                .on('dragstart', function () { $$.dragstart(d3.mouse(this)); })
-                .on('dragend', function () { $$.dragend(); })
+            config.data_selection_draggable && $$.drag ? (
+                d3.behavior.drag().origin(Object)
+                    .on('drag', function () { $$.drag(d3.mouse(this)); })
+                    .on('dragstart', function () { $$.dragstart(d3.mouse(this)); })
+                    .on('dragend', function () { $$.dragend(); })
+            ) : function () {}
         );
@@ -240,0 +242,0 @@ };

src/region.js

@@ -7,3 +7,3 @@ c3_chart_internal_fn.initRegion = function () {
 };
-c3_chart_internal_fn.redrawRegion = function (duration) {
+c3_chart_internal_fn.updateRegion = function (duration) {
     var $$ = this, config = $$.config;
@@ -24,4 +24,5 @@
 };
-c3_chart_internal_fn.addTransitionForRegion = function (transitions) {
+c3_chart_internal_fn.redrawRegion = function (withTransition) {
     var $$ = this,
+        regions = $$.mainRegion.selectAll('rect'),
         x = $$.regionX.bind($$),
@@ -31,8 +32,10 @@ y = $$.regionY.bind($$),
         h = $$.regionHeight.bind($$);
-    transitions.push($$.mainRegion.selectAll('rect').transition()
-                     .attr("x", x)
-                     .attr("y", y)
-                     .attr("width", w)
-                     .attr("height", h)
-                     .style("fill-opacity", function (d) { return isValue(d.opacity) ? d.opacity : 0.1; }));
+    return [
+        (withTransition ? regions.transition() : regions)
+            .attr("x", x)
+            .attr("y", y)
+            .attr("width", w)
+            .attr("height", h)
+            .style("fill-opacity", function (d) { return isValue(d.opacity) ? d.opacity : 0.1; })
+    ];
 };
@@ -39,0 +42,0 @@ c3_chart_internal_fn.regionX = function (d) {

src/shape.bar.js

@@ -25,3 +25,3 @@ c3_chart_internal_fn.initBar = function () {
 };
-c3_chart_internal_fn.redrawBar = function (durationForExit) {
+c3_chart_internal_fn.updateBar = function (durationForExit) {
     var $$ = this,
@@ -44,8 +44,9 @@ barData = $$.barData.bind($$),
 };
-c3_chart_internal_fn.addTransitionForBar = function (transitions, drawBar) {
-    var $$ = this;
-    transitions.push($$.mainBar.transition()
-                     .attr('d', drawBar)
-                     .style("fill", $$.color)
-                     .style("opacity", 1));
+c3_chart_internal_fn.redrawBar = function (drawBar, withTransition) {
+    return [
+        (withTransition ? this.mainBar.transition() : this.mainBar)
+            .attr('d', drawBar)
+            .style("fill", this.color)
+            .style("opacity", 1)
+    ];
 };
@@ -52,0 +53,0 @@ c3_chart_internal_fn.getBarW = function (axis, barTargetsNum) {

src/shape.line.js

@@ -42,3 +42,3 @@ c3_chart_internal_fn.initLine = function () {
 };
-c3_chart_internal_fn.redrawLine = function (durationForExit) {
+c3_chart_internal_fn.updateLine = function (durationForExit) {
     var $$ = this;
@@ -58,8 +58,9 @@ $$.mainLine = $$.main.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line)
 };
-c3_chart_internal_fn.addTransitionForLine = function (transitions, drawLine) {
-    var $$ = this;
-    transitions.push($$.mainLine.transition()
-                     .attr("d", drawLine)
-                     .style("stroke", $$.color)
-                     .style("opacity", 1));
+c3_chart_internal_fn.redrawLine = function (drawLine, withTransition) {
+    return [
+        (withTransition ? this.mainLine.transition() : this.mainLine)
+            .attr("d", drawLine)
+            .style("stroke", this.color)
+            .style("opacity", 1)
+    ];
 };
@@ -204,3 +205,3 @@ c3_chart_internal_fn.generateDrawLine = function (lineIndices, isSub) {
 
-c3_chart_internal_fn.redrawArea = function (durationForExit) {
+c3_chart_internal_fn.updateArea = function (durationForExit) {
     var $$ = this, d3 = $$.d3;
@@ -219,8 +220,9 @@ $$.mainArea = $$.main.selectAll('.' + CLASS.areas).selectAll('.' + CLASS.area)
 };
-c3_chart_internal_fn.addTransitionForArea = function (transitions, drawArea) {
-    var $$ = this;
-    transitions.push($$.mainArea.transition()
-                     .attr("d", drawArea)
-                     .style("fill", $$.color)
-                     .style("opacity", $$.orgAreaOpacity));
+c3_chart_internal_fn.redrawArea = function (drawArea, withTransition) {
+    return [
+        (withTransition ? this.mainArea.transition() : this.mainArea)
+            .attr("d", drawArea)
+            .style("fill", this.color)
+            .style("opacity", this.orgAreaOpacity)
+    ];
 };
@@ -289,3 +291,3 @@ c3_chart_internal_fn.generateDrawArea = function (areaIndices, isSub) {
 
-c3_chart_internal_fn.redrawCircle = function () {
+c3_chart_internal_fn.updateCircle = function () {
     var $$ = this;
@@ -302,12 +304,14 @@ $$.mainCircle = $$.main.selectAll('.' + CLASS.circles).selectAll('.' + CLASS.circle)
 };
-c3_chart_internal_fn.addTransitionForCircle = function (transitions, cx, cy) {
-    var $$ = this;
-    transitions.push($$.mainCircle.transition()
-                     .style('opacity', $$.opacityForCircle.bind($$))
-                     .style("fill", $$.color)
-                     .attr("cx", cx)
-                     .attr("cy", cy));
-    transitions.push($$.main.selectAll('.' + CLASS.selectedCircle).transition()
-                     .attr("cx", cx)
-                     .attr("cy", cy));
+c3_chart_internal_fn.redrawCircle = function (cx, cy, withTransition) {
+    var selectedCircles = this.main.selectAll('.' + CLASS.selectedCircle);
+    return [
+        (withTransition ? this.mainCircle.transition() : this.mainCircle)
+            .style('opacity', this.opacityForCircle.bind(this))
+            .style("fill", this.color)
+            .attr("cx", cx)
+            .attr("cy", cy),
+        (withTransition ? selectedCircles.transition() : selectedCircles)
+            .attr("cx", cx)
+            .attr("cy", cy)
+    ];
 };
@@ -314,0 +318,0 @@ c3_chart_internal_fn.circleX = function (d) {

src/subchart.js

@@ -16,5 +16,3 @@ c3_chart_internal_fn.initBrush = function () {
 
-    if (!config.subchart_show) {
-        context.style('visibility', 'hidden');
-    }
+    context.style('visibility', config.subchart_show ? 'visible' : 'hidden');
 
@@ -38,5 +36,3 @@ // Define g for chart area
         .attr("class", CLASS.brush)
-        .call($$.brush)
-        .selectAll("rect")
-        .attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
+        .call($$.brush);
 
@@ -60,2 +56,3 @@ // ATTENTION: This must be called AFTER chart added
     if (config.subchart_show) {
+        //-- Bar --//
         contextBarUpdate = context.select('.' + CLASS.chartBars).selectAll('.' + CLASS.chartBar)
@@ -84,14 +81,71 @@ .data(targets)
             .attr("class", classAreas);
+
+        //-- Brush --//
+        context.selectAll('.' + CLASS.brush + ' rect')
+            .attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
     }
 };
+c3_chart_internal_fn.updateBarForSubchart = function (durationForExit) {
+    var $$ = this;
+    $$.contextBar = $$.context.selectAll('.' + CLASS.bars).selectAll('.' + CLASS.bar)
+        .data($$.barData.bind($$));
+    $$.contextBar.enter().append('path')
+        .attr("class", $$.classBar.bind($$))
+        .style("stroke", 'none')
+        .style("fill", $$.color);
+    $$.contextBar
+        .style("opacity", $$.initialOpacity.bind($$));
+    $$.contextBar.exit().transition().duration(durationForExit)
+        .style('opacity', 0)
+        .remove();
+};
+c3_chart_internal_fn.redrawBarForSubchart = function (drawBarOnSub, withTransition, duration) {
+    (withTransition ? this.contextBar.transition().duration(duration) : this.contextBar)
+        .attr('d', drawBarOnSub)
+        .style('opacity', 1);
+};
+c3_chart_internal_fn.updateLineForSubchart = function (durationForExit) {
+    var $$ = this;
+    $$.contextLine = $$.context.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line)
+        .data($$.lineData.bind($$));
+    $$.contextLine.enter().append('path')
+        .attr('class', $$.classLine.bind($$))
+        .style('stroke', $$.color);
+    $$.contextLine
+        .style("opacity", $$.initialOpacity.bind($$));
+    $$.contextLine.exit().transition().duration(durationForExit)
+        .style('opacity', 0)
+        .remove();
+};
+c3_chart_internal_fn.redrawLineForSubchart = function (drawLineOnSub, withTransition, duration) {
+    (withTransition ? this.contextLine.transition().duration(duration) : this.contextLine)
+        .attr("d", drawLineOnSub)
+        .style('opacity', 1);
+};
+c3_chart_internal_fn.updateAreaForSubchart = function (durationForExit) {
+    var $$ = this, d3 = $$.d3;
+    $$.contextArea = $$.context.selectAll('.' + CLASS.areas).selectAll('.' + CLASS.area)
+        .data($$.lineData.bind($$));
+    $$.contextArea.enter().append('path')
+        .attr("class", $$.classArea.bind($$))
+        .style("fill", $$.color)
+        .style("opacity", function () { $$.orgAreaOpacity = +d3.select(this).style('opacity'); return 0; });
+    $$.contextArea
+        .style("opacity", 0);
+    $$.contextArea.exit().transition().duration(durationForExit)
+        .style('opacity', 0)
+        .remove();
+};
+c3_chart_internal_fn.redrawAreaForSubchart = function (drawAreaOnSub, withTransition, duration) {
+    (withTransition ? this.contextArea.transition().duration(duration) : this.contextArea)
+        .attr("d", drawAreaOnSub)
+        .style("fill", this.color)
+        .style("opacity", this.orgAreaOpacity);
+};
 c3_chart_internal_fn.redrawSubchart = function (withSubchart, transitions, duration, durationForExit, areaIndices, barIndices, lineIndices) {
-    var $$ = this, d3 = $$.d3, context = $$.context, config = $$.config,
-        contextLine,  contextArea, contextBar, drawAreaOnSub, drawBarOnSub, drawLineOnSub,
-        barData = $$.barData.bind($$),
-        lineData = $$.lineData.bind($$),
-        classBar = $$.classBar.bind($$),
-        classLine = $$.classLine.bind($$),
-        classArea = $$.classArea.bind($$),
-        initialOpacity = $$.initialOpacity.bind($$);
+    var $$ = this, d3 = $$.d3, config = $$.config,
+        drawAreaOnSub, drawBarOnSub, drawLineOnSub;
 
+    $$.context.style('visibility', config.subchart_show ? 'visible' : 'hidden');
+
     // subchart
@@ -114,47 +168,10 @@ if (config.subchart_show) {
             drawLineOnSub = $$.generateDrawLine(lineIndices, true);
-            // bars
-            contextBar = context.selectAll('.' + CLASS.bars).selectAll('.' + CLASS.bar)
-                .data(barData);
-            contextBar.enter().append('path')
-                .attr("class", classBar)
-                .style("stroke", 'none')
-                .style("fill", $$.color);
-            contextBar
-                .style("opacity", initialOpacity)
-                .transition().duration(duration)
-                .attr('d', drawBarOnSub)
-                .style('opacity', 1);
-            contextBar.exit().transition().duration(duration)
-                .style('opacity', 0)
-                .remove();
-            // lines
-            contextLine = context.selectAll('.' + CLASS.lines).selectAll('.' + CLASS.line)
-                .data(lineData);
-            contextLine.enter().append('path')
-                .attr('class', classLine)
-                .style('stroke', $$.color);
-            contextLine
-                .style("opacity", initialOpacity)
-                .transition().duration(duration)
-                .attr("d", drawLineOnSub)
-                .style('opacity', 1);
-            contextLine.exit().transition().duration(duration)
-                .style('opacity', 0)
-                .remove();
-            // area
-            contextArea = context.selectAll('.' + CLASS.areas).selectAll('.' + CLASS.area)
-                .data(lineData);
-            contextArea.enter().append('path')
-                .attr("class", classArea)
-                .style("fill", $$.color)
-                .style("opacity", function () { $$.orgAreaOpacity = +d3.select(this).style('opacity'); return 0; });
-            contextArea
-                .style("opacity", 0)
-                .transition().duration(duration)
-                .attr("d", drawAreaOnSub)
-                .style("fill", $$.color)
-                .style("opacity", $$.orgAreaOpacity);
-            contextArea.exit().transition().duration(durationForExit)
-                .style('opacity', 0)
-                .remove();
+
+            $$.updateBarForSubchart(duration);
+            $$.updateLineForSubchart(duration);
+            $$.updateAreaForSubchart(duration);
+
+            $$.redrawBarForSubchart(drawBarOnSub, duration, duration);
+            $$.redrawLineForSubchart(drawLineOnSub, duration, duration);
+            $$.redrawAreaForSubchart(drawAreaOnSub, duration, duration);
         }
@@ -161,0 +178,0 @@ }

src/text.js

@@ -22,3 +22,3 @@ c3_chart_internal_fn.initText = function () {
 };
-c3_chart_internal_fn.redrawText = function (durationForExit) {
+c3_chart_internal_fn.updateText = function (durationForExit) {
     var $$ = this, config = $$.config,
@@ -42,10 +42,10 @@ barOrLineData = $$.barOrLineData.bind($$),
 };
-c3_chart_internal_fn.addTransitionForText = function (transitions, xForText, yForText, forFlow) {
-    var $$ = this,
-        opacityForText = forFlow ? 0 : $$.opacityForText.bind($$);
-    transitions.push($$.mainText.transition()
-                     .attr('x', xForText)
-                     .attr('y', yForText)
-                     .style("fill", $$.color)
-                     .style("fill-opacity", opacityForText));
+c3_chart_internal_fn.redrawText = function (xForText, yForText, forFlow, withTransition) {
+    return [
+        (withTransition ? this.mainText.transition() : this.mainText)
+            .attr('x', xForText)
+            .attr('y', yForText)
+            .style("fill", this.color)
+            .style("fill-opacity", forFlow ? 0 : this.opacityForText.bind(this))
+    ];
 };
@@ -52,0 +52,0 @@ c3_chart_internal_fn.getTextRect = function (text, cls) {

src/tooltip.js

@@ -41,10 +41,12 @@ c3_chart_internal_fn.initTooltip = function () {
 
-        name = nameFormat(d[i].name, d[i].ratio, d[i].id, d[i].index);
         value = valueFormat(d[i].value, d[i].ratio, d[i].id, d[i].index);
-        bgcolor = $$.levelColor ? $$.levelColor(d[i].value) : color(d[i].id);
+        if (value !== undefined) {
+            name = nameFormat(d[i].name, d[i].ratio, d[i].id, d[i].index);
+            bgcolor = $$.levelColor ? $$.levelColor(d[i].value) : color(d[i].id);
 
-        text += "<tr class='" + CLASS.tooltipName + "-" + d[i].id + "'>";
-        text += "<td class='name'><span style='background-color:" + bgcolor + "'></span>" + name + "</td>";
-        text += "<td class='value'>" + value + "</td>";
-        text += "</tr>";
+            text += "<tr class='" + CLASS.tooltipName + "-" + d[i].id + "'>";
+            text += "<td class='name'><span style='background-color:" + bgcolor + "'></span>" + name + "</td>";
+            text += "<td class='value'>" + value + "</td>";
+            text += "</tr>";
+        }
     }
@@ -51,0 +53,0 @@ return text + "</table>";

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2871778

increased by46.94%

Number of package files

262

increased by15.93%

Lines of code

37671

increased by21.52%

Number of lines in readme file

52

increased by6.12%

Worsened metrics

Number of low quality alerts

7

increased by16.67%

Number of low supply chain risk alerts

7

increased by16.67%

Dependency changes

• + Addedajv@6.12.6(transitive)

• + Addedasn1@0.2.6(transitive)

• + Addedassert-plus@1.0.0(transitive)

• + Addedasynckit@0.4.0(transitive)

• + Addedaws-sign2@0.7.0(transitive)

• + Addedaws4@1.13.2(transitive)

• + Addedbcrypt-pbkdf@1.0.2(transitive)

• + Addedbindings@1.5.0(transitive)

• + Addedcaseless@0.12.0(transitive)

• + Addedcombined-stream@1.0.8(transitive)

• + Addedcontextify@0.1.15(transitive)

• + Addedcore-util-is@1.0.2(transitive)

• + Addedcssom@0.3.8(transitive)

• + Addedcssstyle@0.2.37(transitive)

• + Addedd3@3.5.0(transitive)

• + Addeddashdash@1.14.1(transitive)

• + Addeddelayed-stream@1.0.0(transitive)

• + Addeddom-serializer@0.2.2(transitive)

• + Addeddomelementtype@1.3.12.3.0(transitive)

• + Addeddomhandler@2.4.2(transitive)

• + Addeddomutils@1.7.0(transitive)

• + Addedecc-jsbn@0.1.2(transitive)

• + Addedentities@1.1.22.2.0(transitive)

• + Addedextend@3.0.2(transitive)

• + Addedextsprintf@1.3.0(transitive)

• + Addedfast-deep-equal@3.1.3(transitive)

• + Addedfast-json-stable-stringify@2.1.0(transitive)

• + Addedfile-uri-to-path@1.0.0(transitive)

• + Addedforever-agent@0.6.1(transitive)

• + Addedform-data@2.3.3(transitive)

• + Addedgetpass@0.1.7(transitive)

• + Addedhar-schema@2.0.0(transitive)

• + Addedhar-validator@5.1.5(transitive)

• + Addedhtmlparser2@3.10.1(transitive)

• + Addedhttp-signature@1.2.0(transitive)

• + Addedinherits@2.0.4(transitive)

• + Addedis-typedarray@1.0.0(transitive)

• + Addedisstream@0.1.2(transitive)

• + Addedjsbn@0.1.1(transitive)

• + Addedjsdom@1.0.0(transitive)

• + Addedjson-schema@0.4.0(transitive)

• + Addedjson-schema-traverse@0.4.1(transitive)

• + Addedjson-stringify-safe@5.0.1(transitive)

• + Addedjsprim@1.4.2(transitive)

• + Addedmime-db@1.52.0(transitive)

• + Addedmime-types@2.1.35(transitive)

• + Addednan@2.22.0(transitive)

• + Addednwmatcher@1.4.4(transitive)

• + Addedoauth-sign@0.9.0(transitive)

• + Addedparse5@1.5.1(transitive)

• + Addedperformance-now@2.1.0(transitive)

• + Addedpsl@1.9.0(transitive)

• + Addedpunycode@2.3.1(transitive)

• + Addedqs@6.5.3(transitive)

• + Addedreadable-stream@3.6.2(transitive)

• + Addedrequest@2.88.2(transitive)

• + Addedsafe-buffer@5.2.1(transitive)

• + Addedsafer-buffer@2.1.2(transitive)

• + Addedsshpk@1.18.0(transitive)

• + Addedstring_decoder@1.3.0(transitive)

• + Addedtough-cookie@2.5.0(transitive)

• + Addedtunnel-agent@0.6.0(transitive)

• + Addedtweetnacl@0.14.5(transitive)

• + Addeduri-js@4.4.1(transitive)

• + Addedutil-deprecate@1.0.2(transitive)

• + Addeduuid@3.4.0(transitive)

• + Addedverror@1.10.0(transitive)

• + Addedxmlhttprequest@1.8.0(transitive)

• - Removedd3@3.5.17(transitive)

• Updatedd3@<=3.5.0