-/* @license C3.js v0.6.7 | (c) C3 Team and other contributors | http://c3js.org/ */
+/* @license C3.js v0.6.9 | (c) C3 Team and other contributors | http://c3js.org/ */
(function (global, factory) {
- typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
- typeof define === 'function' && define.amd ? define(factory) :
- (global.c3 = factory());
+ typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+ typeof define === 'function' && define.amd ? define(factory) :
+ (global.c3 = factory());
}(this, (function () { 'use strict';
- function ChartInternal(api) {
- var $$ = this;
- $$.d3 = window.d3 ? window.d3 : typeof require !== 'undefined' ? require("d3") : undefined;
- $$.api = api;
- $$.config = $$.getDefaultConfig();
- $$.data = {};
- $$.cache = {};
- $$.axes = {};
- }
-
- function Chart(config) {
- var $$ = this.internal = new ChartInternal(this);
- $$.loadConfig(config);
-
- $$.beforeInit(config);
- $$.init();
- $$.afterInit(config);
-
- // bind "this" to nested API
- (function bindThis(fn, target, argThis) {
- Object.keys(fn).forEach(function (key) {
- target[key] = fn[key].bind(argThis);
- if (Object.keys(fn[key]).length > 0) {
- bindThis(fn[key], target[key], argThis);
- }
- });
- })(Chart.prototype, this, this);
- }
-
- function AxisInternal(component, params) {
- var internal = this;
- internal.component = component;
- internal.params = params || {};
-
- internal.d3 = component.d3;
- internal.scale = internal.d3.scaleLinear();
- internal.range;
- internal.orient = "bottom";
- internal.innerTickSize = 6;
- internal.outerTickSize = this.params.withOuterTick ? 6 : 0;
- internal.tickPadding = 3;
- internal.tickValues = null;
- internal.tickFormat;
- internal.tickArguments;
-
- internal.tickOffset = 0;
- internal.tickCulling = true;
- internal.tickCentered;
- internal.tickTextCharSize;
- internal.tickTextRotate = internal.params.tickTextRotate;
- internal.tickLength;
-
- internal.axis = internal.generateAxis();
- }
-
- AxisInternal.prototype.axisX = function (selection, x, tickOffset) {
- selection.attr("transform", function (d) {
- return "translate(" + Math.ceil(x(d) + tickOffset) + ", 0)";
- });
- };
- AxisInternal.prototype.axisY = function (selection, y) {
- selection.attr("transform", function (d) {
- return "translate(0," + Math.ceil(y(d)) + ")";
- });
- };
- AxisInternal.prototype.scaleExtent = function (domain) {
- var start = domain[0],
- stop = domain[domain.length - 1];
- return start < stop ? [start, stop] : [stop, start];
- };
- AxisInternal.prototype.generateTicks = function (scale) {
- var internal = this;
- var i,
- domain,
- ticks = [];
- if (scale.ticks) {
- return scale.ticks.apply(scale, internal.tickArguments);
- }
- domain = scale.domain();
- for (i = Math.ceil(domain[0]); i < domain[1]; i++) {
- ticks.push(i);
- }
- if (ticks.length > 0 && ticks[0] > 0) {
- ticks.unshift(ticks[0] - (ticks[1] - ticks[0]));
- }
- return ticks;
- };
- AxisInternal.prototype.copyScale = function () {
- var internal = this;
- var newScale = internal.scale.copy(),
- domain;
- if (internal.params.isCategory) {
- domain = internal.scale.domain();
- newScale.domain([domain[0], domain[1] - 1]);
- }
- return newScale;
- };
- AxisInternal.prototype.textFormatted = function (v) {
- var internal = this,
- formatted = internal.tickFormat ? internal.tickFormat(v) : v;
- return typeof formatted !== 'undefined' ? formatted : '';
- };
- AxisInternal.prototype.updateRange = function () {
- var internal = this;
- internal.range = internal.scale.rangeExtent ? internal.scale.rangeExtent() : internal.scaleExtent(internal.scale.range());
- return internal.range;
- };
- AxisInternal.prototype.updateTickTextCharSize = function (tick) {
- var internal = this;
- if (internal.tickTextCharSize) {
- return internal.tickTextCharSize;
- }
- var size = {
- h: 11.5,
- w: 5.5
- };
- tick.select('text').text(function (d) {
- return internal.textFormatted(d);
- }).each(function (d) {
- var box = this.getBoundingClientRect(),
- text = internal.textFormatted(d),
- h = box.height,
- w = text ? box.width / text.length : undefined;
- if (h && w) {
- size.h = h;
- size.w = w;
- }
- }).text('');
- internal.tickTextCharSize = size;
- return size;
- };
- AxisInternal.prototype.isVertical = function () {
- return this.orient === 'left' || this.orient === 'right';
- };
- AxisInternal.prototype.tspanData = function (d, i, scale) {
- var internal = this;
- var splitted = internal.params.tickMultiline ? internal.splitTickText(d, scale) : [].concat(internal.textFormatted(d));
+ function _typeof(obj) {
+ if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
+ _typeof = function (obj) {
+ return typeof obj;
+ };
+ } else {
+ _typeof = function (obj) {
+ return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+ };
+ }
- if (internal.params.tickMultiline && internal.params.tickMultilineMax > 0) {
- splitted = internal.ellipsify(splitted, internal.params.tickMultilineMax);
- }
+ return _typeof(obj);
+ }
- return splitted.map(function (s) {
- return { index: i, splitted: s, length: splitted.length };
- });
- };
- AxisInternal.prototype.splitTickText = function (d, scale) {
- var internal = this,
- tickText = internal.textFormatted(d),
- maxWidth = internal.params.tickWidth,
- subtext,
- spaceIndex,
- textWidth,
- splitted = [];
-
- if (Object.prototype.toString.call(tickText) === "[object Array]") {
- return tickText;
- }
+ function _classCallCheck(instance, Constructor) {
+ if (!(instance instanceof Constructor)) {
+ throw new TypeError("Cannot call a class as a function");
+ }
+ }
+
+ function _defineProperty(obj, key, value) {
+ if (key in obj) {
+ Object.defineProperty(obj, key, {
+ value: value,
+ enumerable: true,
+ configurable: true,
+ writable: true
+ });
+ } else {
+ obj[key] = value;
+ }
- if (!maxWidth || maxWidth <= 0) {
- maxWidth = internal.isVertical() ? 95 : internal.params.isCategory ? Math.ceil(scale(1) - scale(0)) - 12 : 110;
- }
+ return obj;
+ }
+
+ function ChartInternal(api) {
+ var $$ = this;
+ $$.d3 = window.d3 ? window.d3 : typeof require !== 'undefined' ? require("d3") : undefined;
+ $$.api = api;
+ $$.config = $$.getDefaultConfig();
+ $$.data = {};
+ $$.cache = {};
+ $$.axes = {};
+ }
+
+ function Chart(config) {
+ var $$ = this.internal = new ChartInternal(this);
+ $$.loadConfig(config);
+ $$.beforeInit(config);
+ $$.init();
+ $$.afterInit(config); // bind "this" to nested API
+
+ (function bindThis(fn, target, argThis) {
+ Object.keys(fn).forEach(function (key) {
+ target[key] = fn[key].bind(argThis);
+
+ if (Object.keys(fn[key]).length > 0) {
+ bindThis(fn[key], target[key], argThis);
+ }
+ });
+ })(Chart.prototype, this, this);
+ }
+
+ function AxisInternal(component, params) {
+ var internal = this;
+ internal.component = component;
+ internal.params = params || {};
+ internal.d3 = component.d3;
+ internal.scale = internal.d3.scaleLinear();
+ internal.range;
+ internal.orient = "bottom";
+ internal.innerTickSize = 6;
+ internal.outerTickSize = this.params.withOuterTick ? 6 : 0;
+ internal.tickPadding = 3;
+ internal.tickValues = null;
+ internal.tickFormat;
+ internal.tickArguments;
+ internal.tickOffset = 0;
+ internal.tickCulling = true;
+ internal.tickCentered;
+ internal.tickTextCharSize;
+ internal.tickTextRotate = internal.params.tickTextRotate;
+ internal.tickLength;
+ internal.axis = internal.generateAxis();
+ }
+
+ AxisInternal.prototype.axisX = function (selection, x, tickOffset) {
+ selection.attr("transform", function (d) {
+ return "translate(" + Math.ceil(x(d) + tickOffset) + ", 0)";
+ });
+ };
+
+ AxisInternal.prototype.axisY = function (selection, y) {
+ selection.attr("transform", function (d) {
+ return "translate(0," + Math.ceil(y(d)) + ")";
+ });
+ };
+
+ AxisInternal.prototype.scaleExtent = function (domain) {
+ var start = domain[0],
+ stop = domain[domain.length - 1];
+ return start < stop ? [start, stop] : [stop, start];
+ };
+
+ AxisInternal.prototype.generateTicks = function (scale) {
+ var internal = this;
+ var i,
+ domain,
+ ticks = [];
+
+ if (scale.ticks) {
+ return scale.ticks.apply(scale, internal.tickArguments);
+ }
- function split(splitted, text) {
- spaceIndex = undefined;
- for (var i = 1; i < text.length; i++) {
- if (text.charAt(i) === ' ') {
- spaceIndex = i;
- }
- subtext = text.substr(0, i + 1);
- textWidth = internal.tickTextCharSize.w * subtext.length;
- // if text width gets over tick width, split by space index or crrent index
- if (maxWidth < textWidth) {
- return split(splitted.concat(text.substr(0, spaceIndex ? spaceIndex : i)), text.slice(spaceIndex ? spaceIndex + 1 : i));
- }
- }
- return splitted.concat(text);
- }
+ domain = scale.domain();
- return split(splitted, tickText + "");
- };
- AxisInternal.prototype.ellipsify = function (splitted, max) {
- if (splitted.length <= max) {
- return splitted;
- }
+ for (i = Math.ceil(domain[0]); i < domain[1]; i++) {
+ ticks.push(i);
+ }
- var ellipsified = splitted.slice(0, max);
- var remaining = 3;
- for (var i = max - 1; i >= 0; i--) {
- var available = ellipsified[i].length;
+ if (ticks.length > 0 && ticks[0] > 0) {
+ ticks.unshift(ticks[0] - (ticks[1] - ticks[0]));
+ }
- ellipsified[i] = ellipsified[i].substr(0, available - remaining).padEnd(available, '.');
+ return ticks;
+ };
- remaining -= available;
+ AxisInternal.prototype.copyScale = function () {
+ var internal = this;
+ var newScale = internal.scale.copy(),
+ domain;
- if (remaining <= 0) {
- break;
- }
- }
+ if (internal.params.isCategory) {
+ domain = internal.scale.domain();
+ newScale.domain([domain[0], domain[1] - 1]);
+ }
- return ellipsified;
- };
- AxisInternal.prototype.updateTickLength = function () {
- var internal = this;
- internal.tickLength = Math.max(internal.innerTickSize, 0) + internal.tickPadding;
- };
- AxisInternal.prototype.lineY2 = function (d) {
- var internal = this,
- tickPosition = internal.scale(d) + (internal.tickCentered ? 0 : internal.tickOffset);
- return internal.range[0] < tickPosition && tickPosition < internal.range[1] ? internal.innerTickSize : 0;
- };
- AxisInternal.prototype.textY = function () {
- var internal = this,
- rotate = internal.tickTextRotate;
- return rotate ? 11.5 - 2.5 * (rotate / 15) * (rotate > 0 ? 1 : -1) : internal.tickLength;
- };
- AxisInternal.prototype.textTransform = function () {
- var internal = this,
- rotate = internal.tickTextRotate;
- return rotate ? "rotate(" + rotate + ")" : "";
- };
- AxisInternal.prototype.textTextAnchor = function () {
- var internal = this,
- rotate = internal.tickTextRotate;
- return rotate ? rotate > 0 ? "start" : "end" : "middle";
- };
- AxisInternal.prototype.tspanDx = function () {
- var internal = this,
- rotate = internal.tickTextRotate;
- return rotate ? 8 * Math.sin(Math.PI * (rotate / 180)) : 0;
- };
- AxisInternal.prototype.tspanDy = function (d, i) {
- var internal = this,
- dy = internal.tickTextCharSize.h;
- if (i === 0) {
- if (internal.isVertical()) {
- dy = -((d.length - 1) * (internal.tickTextCharSize.h / 2) - 3);
- } else {
- dy = ".71em";
- }
- }
- return dy;
- };
+ return newScale;
+ };
- AxisInternal.prototype.generateAxis = function () {
- var internal = this,
- d3 = internal.d3,
- params = internal.params;
- function axis(g, transition) {
- var self;
- g.each(function () {
- var g = axis.g = d3.select(this);
-
- var scale0 = this.__chart__ || internal.scale,
- scale1 = this.__chart__ = internal.copyScale();
-
- var ticksValues = internal.tickValues ? internal.tickValues : internal.generateTicks(scale1),
- ticks = g.selectAll(".tick").data(ticksValues, scale1),
- tickEnter = ticks.enter().insert("g", ".domain").attr("class", "tick").style("opacity", 1e-6),
-
- // MEMO: No exit transition. The reason is this transition affects max tick width calculation because old tick will be included in the ticks.
- tickExit = ticks.exit().remove(),
- tickUpdate = ticks.merge(tickEnter),
- tickTransform,
- tickX,
- tickY;
-
- if (params.isCategory) {
- internal.tickOffset = Math.ceil((scale1(1) - scale1(0)) / 2);
- tickX = internal.tickCentered ? 0 : internal.tickOffset;
- tickY = internal.tickCentered ? internal.tickOffset : 0;
- } else {
- internal.tickOffset = tickX = 0;
- }
-
- internal.updateRange();
- internal.updateTickLength();
- internal.updateTickTextCharSize(g.select('.tick'));
-
- var lineUpdate = tickUpdate.select("line").merge(tickEnter.append("line")),
- textUpdate = tickUpdate.select("text").merge(tickEnter.append("text"));
-
- var tspans = tickUpdate.selectAll('text').selectAll('tspan').data(function (d, i) {
- return internal.tspanData(d, i, scale1);
- }),
- tspanEnter = tspans.enter().append('tspan'),
- tspanUpdate = tspanEnter.merge(tspans).text(function (d) {
- return d.splitted;
- });
- tspans.exit().remove();
-
- var path = g.selectAll(".domain").data([0]),
- pathUpdate = path.enter().append("path").merge(path).attr("class", "domain");
-
- // TODO: each attr should be one function and change its behavior by internal.orient, probably
- switch (internal.orient) {
- case "bottom":
- {
- tickTransform = internal.axisX;
- lineUpdate.attr("x1", tickX).attr("x2", tickX).attr("y2", function (d, i) {
- return internal.lineY2(d, i);
- });
- textUpdate.attr("x", 0).attr("y", function (d, i) {
- return internal.textY(d, i);
- }).attr("transform", function (d, i) {
- return internal.textTransform(d, i);
- }).style("text-anchor", function (d, i) {
- return internal.textTextAnchor(d, i);
- });
- tspanUpdate.attr('x', 0).attr("dy", function (d, i) {
- return internal.tspanDy(d, i);
- }).attr('dx', function (d, i) {
- return internal.tspanDx(d, i);
- });
- pathUpdate.attr("d", "M" + internal.range[0] + "," + internal.outerTickSize + "V0H" + internal.range[1] + "V" + internal.outerTickSize);
- break;
- }
- case "top":
- {
- // TODO: rotated tick text
- tickTransform = internal.axisX;
- lineUpdate.attr("x1", tickX).attr("x2", tickX).attr("y2", function (d, i) {
- return -1 * internal.lineY2(d, i);
- });
- textUpdate.attr("x", 0).attr("y", function (d, i) {
- return -1 * internal.textY(d, i) - (params.isCategory ? 2 : internal.tickLength - 2);
- }).attr("transform", function (d, i) {
- return internal.textTransform(d, i);
- }).style("text-anchor", function (d, i) {
- return internal.textTextAnchor(d, i);
- });
- tspanUpdate.attr('x', 0).attr("dy", function (d, i) {
- return internal.tspanDy(d, i);
- }).attr('dx', function (d, i) {
- return internal.tspanDx(d, i);
- });
- pathUpdate.attr("d", "M" + internal.range[0] + "," + -internal.outerTickSize + "V0H" + internal.range[1] + "V" + -internal.outerTickSize);
- break;
- }
- case "left":
- {
- tickTransform = internal.axisY;
- lineUpdate.attr("x2", -internal.innerTickSize).attr("y1", tickY).attr("y2", tickY);
- textUpdate.attr("x", -internal.tickLength).attr("y", internal.tickOffset).style("text-anchor", "end");
- tspanUpdate.attr('x', -internal.tickLength).attr("dy", function (d, i) {
- return internal.tspanDy(d, i);
- });
- pathUpdate.attr("d", "M" + -internal.outerTickSize + "," + internal.range[0] + "H0V" + internal.range[1] + "H" + -internal.outerTickSize);
- break;
- }
- case "right":
- {
- tickTransform = internal.axisY;
- lineUpdate.attr("x2", internal.innerTickSize).attr("y1", tickY).attr("y2", tickY);
- textUpdate.attr("x", internal.tickLength).attr("y", internal.tickOffset).style("text-anchor", "start");
- tspanUpdate.attr('x', internal.tickLength).attr("dy", function (d, i) {
- return internal.tspanDy(d, i);
- });
- pathUpdate.attr("d", "M" + internal.outerTickSize + "," + internal.range[0] + "H0V" + internal.range[1] + "H" + internal.outerTickSize);
- break;
- }
- }
- if (scale1.rangeBand) {
- var x = scale1,
- dx = x.rangeBand() / 2;
- scale0 = scale1 = function scale1(d) {
- return x(d) + dx;
- };
- } else if (scale0.rangeBand) {
- scale0 = scale1;
- } else {
- tickExit.call(tickTransform, scale1, internal.tickOffset);
- }
- tickEnter.call(tickTransform, scale0, internal.tickOffset);
- self = (transition ? tickUpdate.transition(transition) : tickUpdate).style('opacity', 1).call(tickTransform, scale1, internal.tickOffset);
- });
- return self;
- }
- axis.scale = function (x) {
- if (!arguments.length) {
- return internal.scale;
- }
- internal.scale = x;
- return axis;
- };
- axis.orient = function (x) {
- if (!arguments.length) {
- return internal.orient;
- }
- internal.orient = x in { top: 1, right: 1, bottom: 1, left: 1 } ? x + "" : "bottom";
- return axis;
- };
- axis.tickFormat = function (format) {
- if (!arguments.length) {
- return internal.tickFormat;
- }
- internal.tickFormat = format;
- return axis;
- };
- axis.tickCentered = function (isCentered) {
- if (!arguments.length) {
- return internal.tickCentered;
- }
- internal.tickCentered = isCentered;
- return axis;
- };
- axis.tickOffset = function () {
- return internal.tickOffset;
- };
- axis.tickInterval = function () {
- var interval, length;
- if (params.isCategory) {
- interval = internal.tickOffset * 2;
- } else {
- length = axis.g.select('path.domain').node().getTotalLength() - internal.outerTickSize * 2;
- interval = length / axis.g.selectAll('line').size();
- }
- return interval === Infinity ? 0 : interval;
- };
- axis.ticks = function () {
- if (!arguments.length) {
- return internal.tickArguments;
- }
- internal.tickArguments = arguments;
- return axis;
- };
- axis.tickCulling = function (culling) {
- if (!arguments.length) {
- return internal.tickCulling;
- }
- internal.tickCulling = culling;
- return axis;
- };
- axis.tickValues = function (x) {
- if (typeof x === 'function') {
- internal.tickValues = function () {
- return x(internal.scale.domain());
- };
- } else {
- if (!arguments.length) {
- return internal.tickValues;
- }
- internal.tickValues = x;
- }
- return axis;
- };
- return axis;
- };
+ AxisInternal.prototype.textFormatted = function (v) {
+ var internal = this,
+ formatted = internal.tickFormat ? internal.tickFormat(v) : v;
+ return typeof formatted !== 'undefined' ? formatted : '';
+ };
- var CLASS = {
- target: 'c3-target',
- chart: 'c3-chart',
- chartLine: 'c3-chart-line',
- chartLines: 'c3-chart-lines',
- chartBar: 'c3-chart-bar',
- chartBars: 'c3-chart-bars',
- chartText: 'c3-chart-text',
- chartTexts: 'c3-chart-texts',
- chartArc: 'c3-chart-arc',
- chartArcs: 'c3-chart-arcs',
- chartArcsTitle: 'c3-chart-arcs-title',
- chartArcsBackground: 'c3-chart-arcs-background',
- chartArcsGaugeUnit: 'c3-chart-arcs-gauge-unit',
- chartArcsGaugeMax: 'c3-chart-arcs-gauge-max',
- chartArcsGaugeMin: 'c3-chart-arcs-gauge-min',
- selectedCircle: 'c3-selected-circle',
- selectedCircles: 'c3-selected-circles',
- eventRect: 'c3-event-rect',
- eventRects: 'c3-event-rects',
- eventRectsSingle: 'c3-event-rects-single',
- eventRectsMultiple: 'c3-event-rects-multiple',
- zoomRect: 'c3-zoom-rect',
- brush: 'c3-brush',
- dragZoom: 'c3-drag-zoom',
- focused: 'c3-focused',
- defocused: 'c3-defocused',
- region: 'c3-region',
- regions: 'c3-regions',
- title: 'c3-title',
- tooltipContainer: 'c3-tooltip-container',
- tooltip: 'c3-tooltip',
- tooltipName: 'c3-tooltip-name',
- shape: 'c3-shape',
- shapes: 'c3-shapes',
- line: 'c3-line',
- lines: 'c3-lines',
- bar: 'c3-bar',
- bars: 'c3-bars',
- circle: 'c3-circle',
- circles: 'c3-circles',
- arc: 'c3-arc',
- arcLabelLine: 'c3-arc-label-line',
- arcs: 'c3-arcs',
- area: 'c3-area',
- areas: 'c3-areas',
- empty: 'c3-empty',
- text: 'c3-text',
- texts: 'c3-texts',
- gaugeValue: 'c3-gauge-value',
- grid: 'c3-grid',
- gridLines: 'c3-grid-lines',
- xgrid: 'c3-xgrid',
- xgrids: 'c3-xgrids',
- xgridLine: 'c3-xgrid-line',
- xgridLines: 'c3-xgrid-lines',
- xgridFocus: 'c3-xgrid-focus',
- ygrid: 'c3-ygrid',
- ygrids: 'c3-ygrids',
- ygridLine: 'c3-ygrid-line',
- ygridLines: 'c3-ygrid-lines',
- axis: 'c3-axis',
- axisX: 'c3-axis-x',
- axisXLabel: 'c3-axis-x-label',
- axisY: 'c3-axis-y',
- axisYLabel: 'c3-axis-y-label',
- axisY2: 'c3-axis-y2',
- axisY2Label: 'c3-axis-y2-label',
- legendBackground: 'c3-legend-background',
- legendItem: 'c3-legend-item',
- legendItemEvent: 'c3-legend-item-event',
- legendItemTile: 'c3-legend-item-tile',
- legendItemHidden: 'c3-legend-item-hidden',
- legendItemFocused: 'c3-legend-item-focused',
- dragarea: 'c3-dragarea',
- EXPANDED: '_expanded_',
- SELECTED: '_selected_',
- INCLUDED: '_included_'
- };
+ AxisInternal.prototype.updateRange = function () {
+ var internal = this;
+ internal.range = internal.scale.rangeExtent ? internal.scale.rangeExtent() : internal.scaleExtent(internal.scale.range());
+ return internal.range;
+ };
- var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
- return typeof obj;
- } : function (obj) {
- return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
- };
+ AxisInternal.prototype.updateTickTextCharSize = function (tick) {
+ var internal = this;
- var classCallCheck = function (instance, Constructor) {
- if (!(instance instanceof Constructor)) {
- throw new TypeError("Cannot call a class as a function");
- }
- };
+ if (internal.tickTextCharSize) {
+ return internal.tickTextCharSize;
+ }
- var defineProperty = function (obj, key, value) {
- if (key in obj) {
- Object.defineProperty(obj, key, {
- value: value,
- enumerable: true,
- configurable: true,
- writable: true
- });
- } else {
- obj[key] = value;
+ var size = {
+ h: 11.5,
+ w: 5.5
+ };
+ tick.select('text').text(function (d) {
+ return internal.textFormatted(d);
+ }).each(function (d) {
+ var box = this.getBoundingClientRect(),
+ text = internal.textFormatted(d),
+ h = box.height,
+ w = text ? box.width / text.length : undefined;
+
+ if (h && w) {
+ size.h = h;
+ size.w = w;
}
+ }).text('');
+ internal.tickTextCharSize = size;
+ return size;
+ };
- return obj;
- };
-
- var asHalfPixel = function asHalfPixel(n) {
- return Math.ceil(n) + 0.5;
- };
- var ceil10 = function ceil10(v) {
- return Math.ceil(v / 10) * 10;
- };
- var diffDomain = function diffDomain(d) {
- return d[1] - d[0];
- };
- var getOption = function getOption(options, key, defaultValue) {
- return isDefined(options[key]) ? options[key] : defaultValue;
- };
- var getPathBox = function getPathBox(path) {
- var box = path.getBoundingClientRect(),
- items = [path.pathSegList.getItem(0), path.pathSegList.getItem(1)],
- minX = items[0].x,
- minY = Math.min(items[0].y, items[1].y);
- return { x: minX, y: minY, width: box.width, height: box.height };
- };
- var hasValue = function hasValue(dict, value) {
- var found = false;
- Object.keys(dict).forEach(function (key) {
- if (dict[key] === value) {
- found = true;
- }
- });
- return found;
- };
- var isArray = function isArray(o) {
- return Array.isArray(o);
- };
- var isDefined = function isDefined(v) {
- return typeof v !== 'undefined';
- };
- var isEmpty = function isEmpty(o) {
- return typeof o === 'undefined' || o === null || isString(o) && o.length === 0 || (typeof o === 'undefined' ? 'undefined' : _typeof(o)) === 'object' && Object.keys(o).length === 0;
- };
- var isFunction = function isFunction(o) {
- return typeof o === 'function';
- };
- var isString = function isString(o) {
- return typeof o === 'string';
- };
- var isUndefined = function isUndefined(v) {
- return typeof v === 'undefined';
- };
- var isValue = function isValue(v) {
- return v || v === 0;
- };
- var notEmpty = function notEmpty(o) {
- return !isEmpty(o);
- };
- var sanitise = function sanitise(str) {
- return typeof str === 'string' ? str.replace(/</g, '<').replace(/>/g, '>') : str;
- };
+ AxisInternal.prototype.isVertical = function () {
+ return this.orient === 'left' || this.orient === 'right';
+ };
- var Axis = function Axis(owner) {
- classCallCheck(this, Axis);
+ AxisInternal.prototype.tspanData = function (d, i, scale) {
+ var internal = this;
+ var splitted = internal.params.tickMultiline ? internal.splitTickText(d, scale) : [].concat(internal.textFormatted(d));
- this.owner = owner;
- this.d3 = owner.d3;
- this.internal = AxisInternal;
- };
+ if (internal.params.tickMultiline && internal.params.tickMultilineMax > 0) {
+ splitted = internal.ellipsify(splitted, internal.params.tickMultilineMax);
+ }
- Axis.prototype.init = function init() {
- var $$ = this.owner,
- config = $$.config,
- main = $$.main;
- $$.axes.x = main.append("g").attr("class", CLASS.axis + ' ' + CLASS.axisX).attr("clip-path", config.axis_x_inner ? "" : $$.clipPathForXAxis).attr("transform", $$.getTranslate('x')).style("visibility", config.axis_x_show ? 'visible' : 'hidden');
- $$.axes.x.append("text").attr("class", CLASS.axisXLabel).attr("transform", config.axis_rotated ? "rotate(-90)" : "").style("text-anchor", this.textAnchorForXAxisLabel.bind(this));
- $$.axes.y = main.append("g").attr("class", CLASS.axis + ' ' + CLASS.axisY).attr("clip-path", config.axis_y_inner ? "" : $$.clipPathForYAxis).attr("transform", $$.getTranslate('y')).style("visibility", config.axis_y_show ? 'visible' : 'hidden');
- $$.axes.y.append("text").attr("class", CLASS.axisYLabel).attr("transform", config.axis_rotated ? "" : "rotate(-90)").style("text-anchor", this.textAnchorForYAxisLabel.bind(this));
-
- $$.axes.y2 = main.append("g").attr("class", CLASS.axis + ' ' + CLASS.axisY2)
- // clip-path?
- .attr("transform", $$.getTranslate('y2')).style("visibility", config.axis_y2_show ? 'visible' : 'hidden');
- $$.axes.y2.append("text").attr("class", CLASS.axisY2Label).attr("transform", config.axis_rotated ? "" : "rotate(-90)").style("text-anchor", this.textAnchorForY2AxisLabel.bind(this));
- };
- Axis.prototype.getXAxis = function getXAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText) {
- var $$ = this.owner,
- config = $$.config,
- axisParams = {
- isCategory: $$.isCategorized(),
- withOuterTick: withOuterTick,
- tickMultiline: config.axis_x_tick_multiline,
- tickMultilineMax: config.axis_x_tick_multiline ? Number(config.axis_x_tick_multilineMax) : 0,
- tickWidth: config.axis_x_tick_width,
- tickTextRotate: withoutRotateTickText ? 0 : config.axis_x_tick_rotate,
- withoutTransition: withoutTransition
- },
- axis = new this.internal(this, axisParams).axis.scale(scale).orient(orient);
+ return splitted.map(function (s) {
+ return {
+ index: i,
+ splitted: s,
+ length: splitted.length
+ };
+ });
+ };
+
+ AxisInternal.prototype.splitTickText = function (d, scale) {
+ var internal = this,
+ tickText = internal.textFormatted(d),
+ maxWidth = internal.params.tickWidth,
+ subtext,
+ spaceIndex,
+ textWidth,
+ splitted = [];
+
+ if (Object.prototype.toString.call(tickText) === "[object Array]") {
+ return tickText;
+ }
- if ($$.isTimeSeries() && tickValues && typeof tickValues !== "function") {
- tickValues = tickValues.map(function (v) {
- return $$.parseDate(v);
- });
- }
+ if (!maxWidth || maxWidth <= 0) {
+ maxWidth = internal.isVertical() ? 95 : internal.params.isCategory ? Math.ceil(scale(1) - scale(0)) - 12 : 110;
+ }
- // Set tick
- axis.tickFormat(tickFormat).tickValues(tickValues);
- if ($$.isCategorized()) {
- axis.tickCentered(config.axis_x_tick_centered);
- if (isEmpty(config.axis_x_tick_culling)) {
- config.axis_x_tick_culling = false;
- }
- }
+ function split(splitted, text) {
+ spaceIndex = undefined;
- return axis;
- };
- Axis.prototype.updateXAxisTickValues = function updateXAxisTickValues(targets, axis) {
- var $$ = this.owner,
- config = $$.config,
- tickValues;
- if (config.axis_x_tick_fit || config.axis_x_tick_count) {
- tickValues = this.generateTickValues($$.mapTargetsToUniqueXs(targets), config.axis_x_tick_count, $$.isTimeSeries());
- }
- if (axis) {
- axis.tickValues(tickValues);
- } else {
- $$.xAxis.tickValues(tickValues);
- $$.subXAxis.tickValues(tickValues);
- }
- return tickValues;
- };
- Axis.prototype.getYAxis = function getYAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText) {
- var $$ = this.owner,
- config = $$.config,
- axisParams = {
- withOuterTick: withOuterTick,
- withoutTransition: withoutTransition,
- tickTextRotate: withoutRotateTickText ? 0 : config.axis_y_tick_rotate
- },
- axis = new this.internal(this, axisParams).axis.scale(scale).orient(orient).tickFormat(tickFormat);
- if ($$.isTimeSeriesY()) {
- axis.ticks(config.axis_y_tick_time_type, config.axis_y_tick_time_interval);
- } else {
- axis.tickValues(tickValues);
+ for (var i = 1; i < text.length; i++) {
+ if (text.charAt(i) === ' ') {
+ spaceIndex = i;
}
- return axis;
- };
- Axis.prototype.getId = function getId(id) {
- var config = this.owner.config;
- return id in config.data_axes ? config.data_axes[id] : 'y';
- };
- Axis.prototype.getXAxisTickFormat = function getXAxisTickFormat() {
- // #2251 previously set any negative values to a whole number,
- // however both should be truncated according to the users format specification
- var $$ = this.owner,
- config = $$.config;
- var format = $$.isTimeSeries() ? $$.defaultAxisTimeFormat : $$.isCategorized() ? $$.categoryName : function (v) {
- return v;
- };
- if (config.axis_x_tick_format) {
- if (isFunction(config.axis_x_tick_format)) {
- format = config.axis_x_tick_format;
- } else if ($$.isTimeSeries()) {
- format = function format(date) {
- return date ? $$.axisTimeFormat(config.axis_x_tick_format)(date) : "";
- };
- }
- }
- return isFunction(format) ? function (v) {
- return format.call($$, v);
- } : format;
- };
- Axis.prototype.getTickValues = function getTickValues(tickValues, axis) {
- return tickValues ? tickValues : axis ? axis.tickValues() : undefined;
- };
- Axis.prototype.getXAxisTickValues = function getXAxisTickValues() {
- return this.getTickValues(this.owner.config.axis_x_tick_values, this.owner.xAxis);
- };
- Axis.prototype.getYAxisTickValues = function getYAxisTickValues() {
- return this.getTickValues(this.owner.config.axis_y_tick_values, this.owner.yAxis);
- };
- Axis.prototype.getY2AxisTickValues = function getY2AxisTickValues() {
- return this.getTickValues(this.owner.config.axis_y2_tick_values, this.owner.y2Axis);
- };
- Axis.prototype.getLabelOptionByAxisId = function getLabelOptionByAxisId(axisId) {
- var $$ = this.owner,
- config = $$.config,
- option;
- if (axisId === 'y') {
- option = config.axis_y_label;
- } else if (axisId === 'y2') {
- option = config.axis_y2_label;
- } else if (axisId === 'x') {
- option = config.axis_x_label;
- }
- return option;
- };
- Axis.prototype.getLabelText = function getLabelText(axisId) {
- var option = this.getLabelOptionByAxisId(axisId);
- return isString(option) ? option : option ? option.text : null;
- };
- Axis.prototype.setLabelText = function setLabelText(axisId, text) {
- var $$ = this.owner,
- config = $$.config,
- option = this.getLabelOptionByAxisId(axisId);
- if (isString(option)) {
- if (axisId === 'y') {
- config.axis_y_label = text;
- } else if (axisId === 'y2') {
- config.axis_y2_label = text;
- } else if (axisId === 'x') {
- config.axis_x_label = text;
- }
- } else if (option) {
- option.text = text;
- }
- };
- Axis.prototype.getLabelPosition = function getLabelPosition(axisId, defaultPosition) {
- var option = this.getLabelOptionByAxisId(axisId),
- position = option && (typeof option === 'undefined' ? 'undefined' : _typeof(option)) === 'object' && option.position ? option.position : defaultPosition;
- return {
- isInner: position.indexOf('inner') >= 0,
- isOuter: position.indexOf('outer') >= 0,
- isLeft: position.indexOf('left') >= 0,
- isCenter: position.indexOf('center') >= 0,
- isRight: position.indexOf('right') >= 0,
- isTop: position.indexOf('top') >= 0,
- isMiddle: position.indexOf('middle') >= 0,
- isBottom: position.indexOf('bottom') >= 0
- };
- };
- Axis.prototype.getXAxisLabelPosition = function getXAxisLabelPosition() {
- return this.getLabelPosition('x', this.owner.config.axis_rotated ? 'inner-top' : 'inner-right');
- };
- Axis.prototype.getYAxisLabelPosition = function getYAxisLabelPosition() {
- return this.getLabelPosition('y', this.owner.config.axis_rotated ? 'inner-right' : 'inner-top');
- };
- Axis.prototype.getY2AxisLabelPosition = function getY2AxisLabelPosition() {
- return this.getLabelPosition('y2', this.owner.config.axis_rotated ? 'inner-right' : 'inner-top');
- };
- Axis.prototype.getLabelPositionById = function getLabelPositionById(id) {
- return id === 'y2' ? this.getY2AxisLabelPosition() : id === 'y' ? this.getYAxisLabelPosition() : this.getXAxisLabelPosition();
- };
- Axis.prototype.textForXAxisLabel = function textForXAxisLabel() {
- return this.getLabelText('x');
- };
- Axis.prototype.textForYAxisLabel = function textForYAxisLabel() {
- return this.getLabelText('y');
- };
- Axis.prototype.textForY2AxisLabel = function textForY2AxisLabel() {
- return this.getLabelText('y2');
- };
- Axis.prototype.xForAxisLabel = function xForAxisLabel(forHorizontal, position) {
- var $$ = this.owner;
- if (forHorizontal) {
- return position.isLeft ? 0 : position.isCenter ? $$.width / 2 : $$.width;
- } else {
- return position.isBottom ? -$$.height : position.isMiddle ? -$$.height / 2 : 0;
- }
- };
- Axis.prototype.dxForAxisLabel = function dxForAxisLabel(forHorizontal, position) {
- if (forHorizontal) {
- return position.isLeft ? "0.5em" : position.isRight ? "-0.5em" : "0";
- } else {
- return position.isTop ? "-0.5em" : position.isBottom ? "0.5em" : "0";
- }
- };
- Axis.prototype.textAnchorForAxisLabel = function textAnchorForAxisLabel(forHorizontal, position) {
- if (forHorizontal) {
- return position.isLeft ? 'start' : position.isCenter ? 'middle' : 'end';
- } else {
- return position.isBottom ? 'start' : position.isMiddle ? 'middle' : 'end';
- }
- };
- Axis.prototype.xForXAxisLabel = function xForXAxisLabel() {
- return this.xForAxisLabel(!this.owner.config.axis_rotated, this.getXAxisLabelPosition());
- };
- Axis.prototype.xForYAxisLabel = function xForYAxisLabel() {
- return this.xForAxisLabel(this.owner.config.axis_rotated, this.getYAxisLabelPosition());
- };
- Axis.prototype.xForY2AxisLabel = function xForY2AxisLabel() {
- return this.xForAxisLabel(this.owner.config.axis_rotated, this.getY2AxisLabelPosition());
- };
- Axis.prototype.dxForXAxisLabel = function dxForXAxisLabel() {
- return this.dxForAxisLabel(!this.owner.config.axis_rotated, this.getXAxisLabelPosition());
- };
- Axis.prototype.dxForYAxisLabel = function dxForYAxisLabel() {
- return this.dxForAxisLabel(this.owner.config.axis_rotated, this.getYAxisLabelPosition());
- };
- Axis.prototype.dxForY2AxisLabel = function dxForY2AxisLabel() {
- return this.dxForAxisLabel(this.owner.config.axis_rotated, this.getY2AxisLabelPosition());
- };
- Axis.prototype.dyForXAxisLabel = function dyForXAxisLabel() {
- var $$ = this.owner,
- config = $$.config,
- position = this.getXAxisLabelPosition();
- if (config.axis_rotated) {
- return position.isInner ? "1.2em" : -25 - ($$.config.axis_x_inner ? 0 : this.getMaxTickWidth('x'));
- } else {
- return position.isInner ? "-0.5em" : config.axis_x_height ? config.axis_x_height - 10 : "3em";
- }
- };
- Axis.prototype.dyForYAxisLabel = function dyForYAxisLabel() {
- var $$ = this.owner,
- position = this.getYAxisLabelPosition();
- if ($$.config.axis_rotated) {
- return position.isInner ? "-0.5em" : "3em";
- } else {
- return position.isInner ? "1.2em" : -10 - ($$.config.axis_y_inner ? 0 : this.getMaxTickWidth('y') + 10);
- }
- };
- Axis.prototype.dyForY2AxisLabel = function dyForY2AxisLabel() {
- var $$ = this.owner,
- position = this.getY2AxisLabelPosition();
- if ($$.config.axis_rotated) {
- return position.isInner ? "1.2em" : "-2.2em";
- } else {
- return position.isInner ? "-0.5em" : 15 + ($$.config.axis_y2_inner ? 0 : this.getMaxTickWidth('y2') + 15);
- }
- };
- Axis.prototype.textAnchorForXAxisLabel = function textAnchorForXAxisLabel() {
- var $$ = this.owner;
- return this.textAnchorForAxisLabel(!$$.config.axis_rotated, this.getXAxisLabelPosition());
- };
- Axis.prototype.textAnchorForYAxisLabel = function textAnchorForYAxisLabel() {
- var $$ = this.owner;
- return this.textAnchorForAxisLabel($$.config.axis_rotated, this.getYAxisLabelPosition());
- };
- Axis.prototype.textAnchorForY2AxisLabel = function textAnchorForY2AxisLabel() {
- var $$ = this.owner;
- return this.textAnchorForAxisLabel($$.config.axis_rotated, this.getY2AxisLabelPosition());
- };
- Axis.prototype.getMaxTickWidth = function getMaxTickWidth(id, withoutRecompute) {
- var $$ = this.owner,
- config = $$.config,
- maxWidth = 0,
- targetsToShow,
- scale,
- axis,
- dummy,
- svg;
- if (withoutRecompute && $$.currentMaxTickWidths[id]) {
- return $$.currentMaxTickWidths[id];
- }
- if ($$.svg) {
- targetsToShow = $$.filterTargetsToShow($$.data.targets);
- if (id === 'y') {
- scale = $$.y.copy().domain($$.getYDomain(targetsToShow, 'y'));
- axis = this.getYAxis(scale, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, false, true, true);
- } else if (id === 'y2') {
- scale = $$.y2.copy().domain($$.getYDomain(targetsToShow, 'y2'));
- axis = this.getYAxis(scale, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, false, true, true);
- } else {
- scale = $$.x.copy().domain($$.getXDomain(targetsToShow));
- axis = this.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, false, true, true);
- this.updateXAxisTickValues(targetsToShow, axis);
- }
- dummy = $$.d3.select('body').append('div').classed('c3', true);
- svg = dummy.append("svg").style('visibility', 'hidden').style('position', 'fixed').style('top', 0).style('left', 0), svg.append('g').call(axis).each(function () {
- $$.d3.select(this).selectAll('text').each(function () {
- var box = this.getBoundingClientRect();
- if (maxWidth < box.width) {
- maxWidth = box.width;
- }
- });
- dummy.remove();
- });
- }
- $$.currentMaxTickWidths[id] = maxWidth <= 0 ? $$.currentMaxTickWidths[id] : maxWidth;
- return $$.currentMaxTickWidths[id];
- };
+ subtext = text.substr(0, i + 1);
+ textWidth = internal.tickTextCharSize.w * subtext.length; // if text width gets over tick width, split by space index or crrent index
- Axis.prototype.updateLabels = function updateLabels(withTransition) {
- var $$ = this.owner;
- var axisXLabel = $$.main.select('.' + CLASS.axisX + ' .' + CLASS.axisXLabel),
- axisYLabel = $$.main.select('.' + CLASS.axisY + ' .' + CLASS.axisYLabel),
- axisY2Label = $$.main.select('.' + CLASS.axisY2 + ' .' + CLASS.axisY2Label);
- (withTransition ? axisXLabel.transition() : axisXLabel).attr("x", this.xForXAxisLabel.bind(this)).attr("dx", this.dxForXAxisLabel.bind(this)).attr("dy", this.dyForXAxisLabel.bind(this)).text(this.textForXAxisLabel.bind(this));
- (withTransition ? axisYLabel.transition() : axisYLabel).attr("x", this.xForYAxisLabel.bind(this)).attr("dx", this.dxForYAxisLabel.bind(this)).attr("dy", this.dyForYAxisLabel.bind(this)).text(this.textForYAxisLabel.bind(this));
- (withTransition ? axisY2Label.transition() : axisY2Label).attr("x", this.xForY2AxisLabel.bind(this)).attr("dx", this.dxForY2AxisLabel.bind(this)).attr("dy", this.dyForY2AxisLabel.bind(this)).text(this.textForY2AxisLabel.bind(this));
- };
- Axis.prototype.getPadding = function getPadding(padding, key, defaultValue, domainLength) {
- var p = typeof padding === 'number' ? padding : padding[key];
- if (!isValue(p)) {
- return defaultValue;
- }
- if (padding.unit === 'ratio') {
- return padding[key] * domainLength;
- }
- // assume padding is pixels if unit is not specified
- return this.convertPixelsToAxisPadding(p, domainLength);
- };
- Axis.prototype.convertPixelsToAxisPadding = function convertPixelsToAxisPadding(pixels, domainLength) {
- var $$ = this.owner,
- length = $$.config.axis_rotated ? $$.width : $$.height;
- return domainLength * (pixels / length);
- };
- Axis.prototype.generateTickValues = function generateTickValues(values, tickCount, forTimeSeries) {
- var tickValues = values,
- targetCount,
- start,
- end,
- count,
- interval,
- i,
- tickValue;
- if (tickCount) {
- targetCount = isFunction(tickCount) ? tickCount() : tickCount;
- // compute ticks according to tickCount
- if (targetCount === 1) {
- tickValues = [values[0]];
- } else if (targetCount === 2) {
- tickValues = [values[0], values[values.length - 1]];
- } else if (targetCount > 2) {
- count = targetCount - 2;
- start = values[0];
- end = values[values.length - 1];
- interval = (end - start) / (count + 1);
- // re-construct unique values
- tickValues = [start];
- for (i = 0; i < count; i++) {
- tickValue = +start + interval * (i + 1);
- tickValues.push(forTimeSeries ? new Date(tickValue) : tickValue);
- }
- tickValues.push(end);
- }
+ if (maxWidth < textWidth) {
+ return split(splitted.concat(text.substr(0, spaceIndex ? spaceIndex : i)), text.slice(spaceIndex ? spaceIndex + 1 : i));
}
- if (!forTimeSeries) {
- tickValues = tickValues.sort(function (a, b) {
- return a - b;
- });
- }
- return tickValues;
- };
- Axis.prototype.generateTransitions = function generateTransitions(duration) {
- var $$ = this.owner,
- axes = $$.axes;
- return {
- axisX: duration ? axes.x.transition().duration(duration) : axes.x,
- axisY: duration ? axes.y.transition().duration(duration) : axes.y,
- axisY2: duration ? axes.y2.transition().duration(duration) : axes.y2,
- axisSubX: duration ? axes.subx.transition().duration(duration) : axes.subx
- };
- };
- Axis.prototype.redraw = function redraw(duration, isHidden) {
- var $$ = this.owner,
- transition = duration ? $$.d3.transition().duration(duration) : null;
- $$.axes.x.style("opacity", isHidden ? 0 : 1).call($$.xAxis, transition);
- $$.axes.y.style("opacity", isHidden ? 0 : 1).call($$.yAxis, transition);
- $$.axes.y2.style("opacity", isHidden ? 0 : 1).call($$.y2Axis, transition);
- $$.axes.subx.style("opacity", isHidden ? 0 : 1).call($$.subXAxis, transition);
- };
+ }
- var c3 = {
- version: "0.6.7",
- chart: {
- fn: Chart.prototype,
- internal: {
- fn: ChartInternal.prototype,
- axis: {
- fn: Axis.prototype,
- internal: {
- fn: AxisInternal.prototype
- }
- }
- }
- },
- generate: function generate(config) {
- return new Chart(config);
- }
- };
+ return splitted.concat(text);
+ }
- ChartInternal.prototype.beforeInit = function () {
- // can do something
- };
- ChartInternal.prototype.afterInit = function () {
- // can do something
- };
- ChartInternal.prototype.init = function () {
- var $$ = this,
- config = $$.config;
-
- $$.initParams();
-
- if (config.data_url) {
- $$.convertUrlToData(config.data_url, config.data_mimeType, config.data_headers, config.data_keys, $$.initWithData);
- } else if (config.data_json) {
- $$.initWithData($$.convertJsonToData(config.data_json, config.data_keys));
- } else if (config.data_rows) {
- $$.initWithData($$.convertRowsToData(config.data_rows));
- } else if (config.data_columns) {
- $$.initWithData($$.convertColumnsToData(config.data_columns));
- } else {
- throw Error('url or json or rows or columns is required.');
- }
- };
+ return split(splitted, tickText + "");
+ };
- ChartInternal.prototype.initParams = function () {
- var $$ = this,
- d3 = $$.d3,
- config = $$.config;
-
- // MEMO: clipId needs to be unique because it conflicts when multiple charts exist
- $$.clipId = "c3-" + +new Date() + '-clip';
- $$.clipIdForXAxis = $$.clipId + '-xaxis';
- $$.clipIdForYAxis = $$.clipId + '-yaxis';
- $$.clipIdForGrid = $$.clipId + '-grid';
- $$.clipIdForSubchart = $$.clipId + '-subchart';
- $$.clipPath = $$.getClipPath($$.clipId);
- $$.clipPathForXAxis = $$.getClipPath($$.clipIdForXAxis);
- $$.clipPathForYAxis = $$.getClipPath($$.clipIdForYAxis);
- $$.clipPathForGrid = $$.getClipPath($$.clipIdForGrid);
- $$.clipPathForSubchart = $$.getClipPath($$.clipIdForSubchart);
-
- $$.dragStart = null;
- $$.dragging = false;
- $$.flowing = false;
- $$.cancelClick = false;
- $$.mouseover = false;
- $$.transiting = false;
-
- $$.color = $$.generateColor();
- $$.levelColor = $$.generateLevelColor();
-
- $$.dataTimeParse = (config.data_xLocaltime ? d3.timeParse : d3.utcParse)($$.config.data_xFormat);
- $$.axisTimeFormat = config.axis_x_localtime ? d3.timeFormat : d3.utcFormat;
- $$.defaultAxisTimeFormat = function (date) {
- if (date.getMilliseconds()) {
- return d3.timeFormat(".%L")(date);
- }
- if (date.getSeconds()) {
- return d3.timeFormat(":%S")(date);
- }
- if (date.getMinutes()) {
- return d3.timeFormat("%I:%M")(date);
- }
- if (date.getHours()) {
- return d3.timeFormat("%I %p")(date);
- }
- if (date.getDay() && date.getDate() !== 1) {
- return d3.timeFormat("%-m/%-d")(date);
- }
- if (date.getDate() !== 1) {
- return d3.timeFormat("%-m/%-d")(date);
- }
- if (date.getMonth()) {
- return d3.timeFormat("%-m/%-d")(date);
- }
- return d3.timeFormat("%Y/%-m/%-d")(date);
- };
- $$.hiddenTargetIds = [];
- $$.hiddenLegendIds = [];
- $$.focusedTargetIds = [];
- $$.defocusedTargetIds = [];
-
- $$.xOrient = config.axis_rotated ? config.axis_x_inner ? "right" : "left" : config.axis_x_inner ? "top" : "bottom";
- $$.yOrient = config.axis_rotated ? config.axis_y_inner ? "top" : "bottom" : config.axis_y_inner ? "right" : "left";
- $$.y2Orient = config.axis_rotated ? config.axis_y2_inner ? "bottom" : "top" : config.axis_y2_inner ? "left" : "right";
- $$.subXOrient = config.axis_rotated ? "left" : "bottom";
-
- $$.isLegendRight = config.legend_position === 'right';
- $$.isLegendInset = config.legend_position === 'inset';
- $$.isLegendTop = config.legend_inset_anchor === 'top-left' || config.legend_inset_anchor === 'top-right';
- $$.isLegendLeft = config.legend_inset_anchor === 'top-left' || config.legend_inset_anchor === 'bottom-left';
- $$.legendStep = 0;
- $$.legendItemWidth = 0;
- $$.legendItemHeight = 0;
-
- $$.currentMaxTickWidths = {
- x: 0,
- y: 0,
- y2: 0
- };
+ AxisInternal.prototype.ellipsify = function (splitted, max) {
+ if (splitted.length <= max) {
+ return splitted;
+ }
- $$.rotated_padding_left = 30;
- $$.rotated_padding_right = config.axis_rotated && !config.axis_x_show ? 0 : 30;
- $$.rotated_padding_top = 5;
+ var ellipsified = splitted.slice(0, max);
+ var remaining = 3;
- $$.withoutFadeIn = {};
+ for (var i = max - 1; i >= 0; i--) {
+ var available = ellipsified[i].length;
+ ellipsified[i] = ellipsified[i].substr(0, available - remaining).padEnd(available, '.');
+ remaining -= available;
- $$.intervalForObserveInserted = undefined;
+ if (remaining <= 0) {
+ break;
+ }
+ }
- $$.axes.subx = d3.selectAll([]); // needs when excluding subchart.js
- };
+ return ellipsified;
+ };
+
+ AxisInternal.prototype.updateTickLength = function () {
+ var internal = this;
+ internal.tickLength = Math.max(internal.innerTickSize, 0) + internal.tickPadding;
+ };
+
+ AxisInternal.prototype.lineY2 = function (d) {
+ var internal = this,
+ tickPosition = internal.scale(d) + (internal.tickCentered ? 0 : internal.tickOffset);
+ return internal.range[0] < tickPosition && tickPosition < internal.range[1] ? internal.innerTickSize : 0;
+ };
+
+ AxisInternal.prototype.textY = function () {
+ var internal = this,
+ rotate = internal.tickTextRotate;
+ return rotate ? 11.5 - 2.5 * (rotate / 15) * (rotate > 0 ? 1 : -1) : internal.tickLength;
+ };
+
+ AxisInternal.prototype.textTransform = function () {
+ var internal = this,
+ rotate = internal.tickTextRotate;
+ return rotate ? "rotate(" + rotate + ")" : "";
+ };
+
+ AxisInternal.prototype.textTextAnchor = function () {
+ var internal = this,
+ rotate = internal.tickTextRotate;
+ return rotate ? rotate > 0 ? "start" : "end" : "middle";
+ };
+
+ AxisInternal.prototype.tspanDx = function () {
+ var internal = this,
+ rotate = internal.tickTextRotate;
+ return rotate ? 8 * Math.sin(Math.PI * (rotate / 180)) : 0;
+ };
+
+ AxisInternal.prototype.tspanDy = function (d, i) {
+ var internal = this,
+ dy = internal.tickTextCharSize.h;
+
+ if (i === 0) {
+ if (internal.isVertical()) {
+ dy = -((d.length - 1) * (internal.tickTextCharSize.h / 2) - 3);
+ } else {
+ dy = ".71em";
+ }
+ }
- ChartInternal.prototype.initChartElements = function () {
- if (this.initBar) {
- this.initBar();
- }
- if (this.initLine) {
- this.initLine();
- }
- if (this.initArc) {
- this.initArc();
- }
- if (this.initGauge) {
- this.initGauge();
- }
- if (this.initText) {
- this.initText();
+ return dy;
+ };
+
+ AxisInternal.prototype.generateAxis = function () {
+ var internal = this,
+ d3 = internal.d3,
+ params = internal.params;
+
+ function axis(g, transition) {
+ var self;
+ g.each(function () {
+ var g = axis.g = d3.select(this);
+ var scale0 = this.__chart__ || internal.scale,
+ scale1 = this.__chart__ = internal.copyScale();
+ var ticksValues = internal.tickValues ? internal.tickValues : internal.generateTicks(scale1),
+ ticks = g.selectAll(".tick").data(ticksValues, scale1),
+ tickEnter = ticks.enter().insert("g", ".domain").attr("class", "tick").style("opacity", 1e-6),
+ // MEMO: No exit transition. The reason is this transition affects max tick width calculation because old tick will be included in the ticks.
+ tickExit = ticks.exit().remove(),
+ tickUpdate = ticks.merge(tickEnter),
+ tickTransform,
+ tickX,
+ tickY;
+
+ if (params.isCategory) {
+ internal.tickOffset = Math.ceil((scale1(1) - scale1(0)) / 2);
+ tickX = internal.tickCentered ? 0 : internal.tickOffset;
+ tickY = internal.tickCentered ? internal.tickOffset : 0;
+ } else {
+ internal.tickOffset = tickX = 0;
}
- };
-
- ChartInternal.prototype.initWithData = function (data) {
- var $$ = this,
- d3 = $$.d3,
- config = $$.config;
- var defs,
- main,
- binding = true;
- $$.axis = new Axis($$);
-
- if (!config.bindto) {
- $$.selectChart = d3.selectAll([]);
- } else if (typeof config.bindto.node === 'function') {
- $$.selectChart = config.bindto;
+ internal.updateRange();
+ internal.updateTickLength();
+ internal.updateTickTextCharSize(g.select('.tick'));
+ var lineUpdate = tickUpdate.select("line").merge(tickEnter.append("line")),
+ textUpdate = tickUpdate.select("text").merge(tickEnter.append("text"));
+ var tspans = tickUpdate.selectAll('text').selectAll('tspan').data(function (d, i) {
+ return internal.tspanData(d, i, scale1);
+ }),
+ tspanEnter = tspans.enter().append('tspan'),
+ tspanUpdate = tspanEnter.merge(tspans).text(function (d) {
+ return d.splitted;
+ });
+ tspans.exit().remove();
+ var path = g.selectAll(".domain").data([0]),
+ pathUpdate = path.enter().append("path").merge(path).attr("class", "domain"); // TODO: each attr should be one function and change its behavior by internal.orient, probably
+
+ switch (internal.orient) {
+ case "bottom":
+ {
+ tickTransform = internal.axisX;
+ lineUpdate.attr("x1", tickX).attr("x2", tickX).attr("y2", function (d, i) {
+ return internal.lineY2(d, i);
+ });
+ textUpdate.attr("x", 0).attr("y", function (d, i) {
+ return internal.textY(d, i);
+ }).attr("transform", function (d, i) {
+ return internal.textTransform(d, i);
+ }).style("text-anchor", function (d, i) {
+ return internal.textTextAnchor(d, i);
+ });
+ tspanUpdate.attr('x', 0).attr("dy", function (d, i) {
+ return internal.tspanDy(d, i);
+ }).attr('dx', function (d, i) {
+ return internal.tspanDx(d, i);
+ });
+ pathUpdate.attr("d", "M" + internal.range[0] + "," + internal.outerTickSize + "V0H" + internal.range[1] + "V" + internal.outerTickSize);
+ break;
+ }
+
+ case "top":
+ {
+ // TODO: rotated tick text
+ tickTransform = internal.axisX;
+ lineUpdate.attr("x1", tickX).attr("x2", tickX).attr("y2", function (d, i) {
+ return -1 * internal.lineY2(d, i);
+ });
+ textUpdate.attr("x", 0).attr("y", function (d, i) {
+ return -1 * internal.textY(d, i) - (params.isCategory ? 2 : internal.tickLength - 2);
+ }).attr("transform", function (d, i) {
+ return internal.textTransform(d, i);
+ }).style("text-anchor", function (d, i) {
+ return internal.textTextAnchor(d, i);
+ });
+ tspanUpdate.attr('x', 0).attr("dy", function (d, i) {
+ return internal.tspanDy(d, i);
+ }).attr('dx', function (d, i) {
+ return internal.tspanDx(d, i);
+ });
+ pathUpdate.attr("d", "M" + internal.range[0] + "," + -internal.outerTickSize + "V0H" + internal.range[1] + "V" + -internal.outerTickSize);
+ break;
+ }
+
+ case "left":
+ {
+ tickTransform = internal.axisY;
+ lineUpdate.attr("x2", -internal.innerTickSize).attr("y1", tickY).attr("y2", tickY);
+ textUpdate.attr("x", -internal.tickLength).attr("y", internal.tickOffset).style("text-anchor", "end");
+ tspanUpdate.attr('x', -internal.tickLength).attr("dy", function (d, i) {
+ return internal.tspanDy(d, i);
+ });
+ pathUpdate.attr("d", "M" + -internal.outerTickSize + "," + internal.range[0] + "H0V" + internal.range[1] + "H" + -internal.outerTickSize);
+ break;
+ }
+
+ case "right":
+ {
+ tickTransform = internal.axisY;
+ lineUpdate.attr("x2", internal.innerTickSize).attr("y1", tickY).attr("y2", tickY);
+ textUpdate.attr("x", internal.tickLength).attr("y", internal.tickOffset).style("text-anchor", "start");
+ tspanUpdate.attr('x', internal.tickLength).attr("dy", function (d, i) {
+ return internal.tspanDy(d, i);
+ });
+ pathUpdate.attr("d", "M" + internal.outerTickSize + "," + internal.range[0] + "H0V" + internal.range[1] + "H" + internal.outerTickSize);
+ break;
+ }
+ }
+
+ if (scale1.rangeBand) {
+ var x = scale1,
+ dx = x.rangeBand() / 2;
+
+ scale0 = scale1 = function scale1(d) {
+ return x(d) + dx;
+ };
+ } else if (scale0.rangeBand) {
+ scale0 = scale1;
} else {
- $$.selectChart = d3.select(config.bindto);
- }
- if ($$.selectChart.empty()) {
- $$.selectChart = d3.select(document.createElement('div')).style('opacity', 0);
- $$.observeInserted($$.selectChart);
- binding = false;
+ tickExit.call(tickTransform, scale1, internal.tickOffset);
}
- $$.selectChart.html("").classed("c3", true);
- // Init data as targets
- $$.data.xs = {};
- $$.data.targets = $$.convertDataToTargets(data);
-
- if (config.data_filter) {
- $$.data.targets = $$.data.targets.filter(config.data_filter);
- }
+ tickEnter.call(tickTransform, scale0, internal.tickOffset);
+ self = (transition ? tickUpdate.transition(transition) : tickUpdate).style('opacity', 1).call(tickTransform, scale1, internal.tickOffset);
+ });
+ return self;
+ }
- // Set targets to hide if needed
- if (config.data_hide) {
- $$.addHiddenTargetIds(config.data_hide === true ? $$.mapToIds($$.data.targets) : config.data_hide);
- }
- if (config.legend_hide) {
- $$.addHiddenLegendIds(config.legend_hide === true ? $$.mapToIds($$.data.targets) : config.legend_hide);
- }
+ axis.scale = function (x) {
+ if (!arguments.length) {
+ return internal.scale;
+ }
- // Init sizes and scales
- $$.updateSizes();
- $$.updateScales();
+ internal.scale = x;
+ return axis;
+ };
- // Set domains for each scale
- $$.x.domain(d3.extent($$.getXDomain($$.data.targets)));
- $$.y.domain($$.getYDomain($$.data.targets, 'y'));
- $$.y2.domain($$.getYDomain($$.data.targets, 'y2'));
- $$.subX.domain($$.x.domain());
- $$.subY.domain($$.y.domain());
- $$.subY2.domain($$.y2.domain());
+ axis.orient = function (x) {
+ if (!arguments.length) {
+ return internal.orient;
+ }
- // Save original x domain for zoom update
- $$.orgXDomain = $$.x.domain();
+ internal.orient = x in {
+ top: 1,
+ right: 1,
+ bottom: 1,
+ left: 1
+ } ? x + "" : "bottom";
+ return axis;
+ };
- /*-- Basic Elements --*/
+ axis.tickFormat = function (format) {
+ if (!arguments.length) {
+ return internal.tickFormat;
+ }
- // Define svgs
- $$.svg = $$.selectChart.append("svg").style("overflow", "hidden").on('mouseenter', function () {
- return config.onmouseover.call($$);
- }).on('mouseleave', function () {
- return config.onmouseout.call($$);
- });
+ internal.tickFormat = format;
+ return axis;
+ };
- if ($$.config.svg_classname) {
- $$.svg.attr('class', $$.config.svg_classname);
- }
+ axis.tickCentered = function (isCentered) {
+ if (!arguments.length) {
+ return internal.tickCentered;
+ }
- // Define defs
- defs = $$.svg.append("defs");
- $$.clipChart = $$.appendClip(defs, $$.clipId);
- $$.clipXAxis = $$.appendClip(defs, $$.clipIdForXAxis);
- $$.clipYAxis = $$.appendClip(defs, $$.clipIdForYAxis);
- $$.clipGrid = $$.appendClip(defs, $$.clipIdForGrid);
- $$.clipSubchart = $$.appendClip(defs, $$.clipIdForSubchart);
- $$.updateSvgSize();
+ internal.tickCentered = isCentered;
+ return axis;
+ };
- // Define regions
- main = $$.main = $$.svg.append("g").attr("transform", $$.getTranslate('main'));
+ axis.tickOffset = function () {
+ return internal.tickOffset;
+ };
- if ($$.initPie) {
- $$.initPie();
- }
- if ($$.initDragZoom) {
- $$.initDragZoom();
- }
- if ($$.initSubchart) {
- $$.initSubchart();
- }
- if ($$.initTooltip) {
- $$.initTooltip();
- }
- if ($$.initLegend) {
- $$.initLegend();
- }
- if ($$.initTitle) {
- $$.initTitle();
- }
- if ($$.initZoom) {
- $$.initZoom();
- }
+ axis.tickInterval = function () {
+ var interval, length;
- // Update selection based on size and scale
- // TODO: currently this must be called after initLegend because of update of sizes, but it should be done in initSubchart.
- if ($$.initSubchartBrush) {
- $$.initSubchartBrush();
- }
+ if (params.isCategory) {
+ interval = internal.tickOffset * 2;
+ } else {
+ length = axis.g.select('path.domain').node().getTotalLength() - internal.outerTickSize * 2;
+ interval = length / axis.g.selectAll('line').size();
+ }
- /*-- Main Region --*/
+ return interval === Infinity ? 0 : interval;
+ };
- // text when empty
- main.append("text").attr("class", CLASS.text + ' ' + CLASS.empty).attr("text-anchor", "middle") // horizontal centering of text at x position in all browsers.
- .attr("dominant-baseline", "middle"); // vertical centering of text at y position in all browsers, except IE.
+ axis.ticks = function () {
+ if (!arguments.length) {
+ return internal.tickArguments;
+ }
- // Regions
- $$.initRegion();
+ internal.tickArguments = arguments;
+ return axis;
+ };
- // Grids
- $$.initGrid();
+ axis.tickCulling = function (culling) {
+ if (!arguments.length) {
+ return internal.tickCulling;
+ }
- // Define g for chart area
- main.append('g').attr("clip-path", $$.clipPath).attr('class', CLASS.chart);
+ internal.tickCulling = culling;
+ return axis;
+ };
- // Grid lines
- if (config.grid_lines_front) {
- $$.initGridLines();
+ axis.tickValues = function (x) {
+ if (typeof x === 'function') {
+ internal.tickValues = function () {
+ return x(internal.scale.domain());
+ };
+ } else {
+ if (!arguments.length) {
+ return internal.tickValues;
}
- // Cover whole with rects for events
- $$.initEventRect();
+ internal.tickValues = x;
+ }
- // Define g for chart
- $$.initChartElements();
+ return axis;
+ };
+
+ return axis;
+ };
+
+ var CLASS = {
+ target: 'c3-target',
+ chart: 'c3-chart',
+ chartLine: 'c3-chart-line',
+ chartLines: 'c3-chart-lines',
+ chartBar: 'c3-chart-bar',
+ chartBars: 'c3-chart-bars',
+ chartText: 'c3-chart-text',
+ chartTexts: 'c3-chart-texts',
+ chartArc: 'c3-chart-arc',
+ chartArcs: 'c3-chart-arcs',
+ chartArcsTitle: 'c3-chart-arcs-title',
+ chartArcsBackground: 'c3-chart-arcs-background',
+ chartArcsGaugeUnit: 'c3-chart-arcs-gauge-unit',
+ chartArcsGaugeMax: 'c3-chart-arcs-gauge-max',
+ chartArcsGaugeMin: 'c3-chart-arcs-gauge-min',
+ selectedCircle: 'c3-selected-circle',
+ selectedCircles: 'c3-selected-circles',
+ eventRect: 'c3-event-rect',
+ eventRects: 'c3-event-rects',
+ eventRectsSingle: 'c3-event-rects-single',
+ eventRectsMultiple: 'c3-event-rects-multiple',
+ zoomRect: 'c3-zoom-rect',
+ brush: 'c3-brush',
+ dragZoom: 'c3-drag-zoom',
+ focused: 'c3-focused',
+ defocused: 'c3-defocused',
+ region: 'c3-region',
+ regions: 'c3-regions',
+ title: 'c3-title',
+ tooltipContainer: 'c3-tooltip-container',
+ tooltip: 'c3-tooltip',
+ tooltipName: 'c3-tooltip-name',
+ shape: 'c3-shape',
+ shapes: 'c3-shapes',
+ line: 'c3-line',
+ lines: 'c3-lines',
+ bar: 'c3-bar',
+ bars: 'c3-bars',
+ circle: 'c3-circle',
+ circles: 'c3-circles',
+ arc: 'c3-arc',
+ arcLabelLine: 'c3-arc-label-line',
+ arcs: 'c3-arcs',
+ area: 'c3-area',
+ areas: 'c3-areas',
+ empty: 'c3-empty',
+ text: 'c3-text',
+ texts: 'c3-texts',
+ gaugeValue: 'c3-gauge-value',
+ grid: 'c3-grid',
+ gridLines: 'c3-grid-lines',
+ xgrid: 'c3-xgrid',
+ xgrids: 'c3-xgrids',
+ xgridLine: 'c3-xgrid-line',
+ xgridLines: 'c3-xgrid-lines',
+ xgridFocus: 'c3-xgrid-focus',
+ ygrid: 'c3-ygrid',
+ ygrids: 'c3-ygrids',
+ ygridLine: 'c3-ygrid-line',
+ ygridLines: 'c3-ygrid-lines',
+ axis: 'c3-axis',
+ axisX: 'c3-axis-x',
+ axisXLabel: 'c3-axis-x-label',
+ axisY: 'c3-axis-y',
+ axisYLabel: 'c3-axis-y-label',
+ axisY2: 'c3-axis-y2',
+ axisY2Label: 'c3-axis-y2-label',
+ legendBackground: 'c3-legend-background',
+ legendItem: 'c3-legend-item',
+ legendItemEvent: 'c3-legend-item-event',
+ legendItemTile: 'c3-legend-item-tile',
+ legendItemHidden: 'c3-legend-item-hidden',
+ legendItemFocused: 'c3-legend-item-focused',
+ dragarea: 'c3-dragarea',
+ EXPANDED: '_expanded_',
+ SELECTED: '_selected_',
+ INCLUDED: '_included_'
+ };
+
+ var asHalfPixel = function asHalfPixel(n) {
+ return Math.ceil(n) + 0.5;
+ };
+ var ceil10 = function ceil10(v) {
+ return Math.ceil(v / 10) * 10;
+ };
+ var diffDomain = function diffDomain(d) {
+ return d[1] - d[0];
+ };
+ var getOption = function getOption(options, key, defaultValue) {
+ return isDefined(options[key]) ? options[key] : defaultValue;
+ };
+ var getPathBox = function getPathBox(path) {
+ var box = path.getBoundingClientRect(),
+ items = [path.pathSegList.getItem(0), path.pathSegList.getItem(1)],
+ minX = items[0].x,
+ minY = Math.min(items[0].y, items[1].y);
+ return {
+ x: minX,
+ y: minY,
+ width: box.width,
+ height: box.height
+ };
+ };
+ var hasValue = function hasValue(dict, value) {
+ var found = false;
+ Object.keys(dict).forEach(function (key) {
+ if (dict[key] === value) {
+ found = true;
+ }
+ });
+ return found;
+ };
+ var isArray = function isArray(o) {
+ return Array.isArray(o);
+ };
+ var isDefined = function isDefined(v) {
+ return typeof v !== 'undefined';
+ };
+ var isEmpty = function isEmpty(o) {
+ return typeof o === 'undefined' || o === null || isString(o) && o.length === 0 || _typeof(o) === 'object' && Object.keys(o).length === 0;
+ };
+ var isFunction = function isFunction(o) {
+ return typeof o === 'function';
+ };
+ var isString = function isString(o) {
+ return typeof o === 'string';
+ };
+ var isUndefined = function isUndefined(v) {
+ return typeof v === 'undefined';
+ };
+ var isValue = function isValue(v) {
+ return v || v === 0;
+ };
+ var notEmpty = function notEmpty(o) {
+ return !isEmpty(o);
+ };
+ var sanitise = function sanitise(str) {
+ return typeof str === 'string' ? str.replace(/</g, '<').replace(/>/g, '>') : str;
+ };
+
+ var Axis = function Axis(owner) {
+ _classCallCheck(this, Axis);
+
+ this.owner = owner;
+ this.d3 = owner.d3;
+ this.internal = AxisInternal;
+ };
+
+ Axis.prototype.init = function init() {
+ var $$ = this.owner,
+ config = $$.config,
+ main = $$.main;
+ $$.axes.x = main.append("g").attr("class", CLASS.axis + ' ' + CLASS.axisX).attr("clip-path", config.axis_x_inner ? "" : $$.clipPathForXAxis).attr("transform", $$.getTranslate('x')).style("visibility", config.axis_x_show ? 'visible' : 'hidden');
+ $$.axes.x.append("text").attr("class", CLASS.axisXLabel).attr("transform", config.axis_rotated ? "rotate(-90)" : "").style("text-anchor", this.textAnchorForXAxisLabel.bind(this));
+ $$.axes.y = main.append("g").attr("class", CLASS.axis + ' ' + CLASS.axisY).attr("clip-path", config.axis_y_inner ? "" : $$.clipPathForYAxis).attr("transform", $$.getTranslate('y')).style("visibility", config.axis_y_show ? 'visible' : 'hidden');
+ $$.axes.y.append("text").attr("class", CLASS.axisYLabel).attr("transform", config.axis_rotated ? "" : "rotate(-90)").style("text-anchor", this.textAnchorForYAxisLabel.bind(this));
+ $$.axes.y2 = main.append("g").attr("class", CLASS.axis + ' ' + CLASS.axisY2) // clip-path?
+ .attr("transform", $$.getTranslate('y2')).style("visibility", config.axis_y2_show ? 'visible' : 'hidden');
+ $$.axes.y2.append("text").attr("class", CLASS.axisY2Label).attr("transform", config.axis_rotated ? "" : "rotate(-90)").style("text-anchor", this.textAnchorForY2AxisLabel.bind(this));
+ };
+
+ Axis.prototype.getXAxis = function getXAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText) {
+ var $$ = this.owner,
+ config = $$.config,
+ axisParams = {
+ isCategory: $$.isCategorized(),
+ withOuterTick: withOuterTick,
+ tickMultiline: config.axis_x_tick_multiline,
+ tickMultilineMax: config.axis_x_tick_multiline ? Number(config.axis_x_tick_multilineMax) : 0,
+ tickWidth: config.axis_x_tick_width,
+ tickTextRotate: withoutRotateTickText ? 0 : config.axis_x_tick_rotate,
+ withoutTransition: withoutTransition
+ },
+ axis = new this.internal(this, axisParams).axis.scale(scale).orient(orient);
+
+ if ($$.isTimeSeries() && tickValues && typeof tickValues !== "function") {
+ tickValues = tickValues.map(function (v) {
+ return $$.parseDate(v);
+ });
+ } // Set tick
+
+
+ axis.tickFormat(tickFormat).tickValues(tickValues);
+
+ if ($$.isCategorized()) {
+ axis.tickCentered(config.axis_x_tick_centered);
+
+ if (isEmpty(config.axis_x_tick_culling)) {
+ config.axis_x_tick_culling = false;
+ }
+ }
- // Add Axis
- $$.axis.init();
+ return axis;
+ };
- // Set targets
- $$.updateTargets($$.data.targets);
+ Axis.prototype.updateXAxisTickValues = function updateXAxisTickValues(targets, axis) {
+ var $$ = this.owner,
+ config = $$.config,
+ tickValues;
- // Set default extent if defined
- if (config.axis_x_selection) {
- $$.brush.selectionAsValue($$.getDefaultSelection());
- }
+ if (config.axis_x_tick_fit || config.axis_x_tick_count) {
+ tickValues = this.generateTickValues($$.mapTargetsToUniqueXs(targets), config.axis_x_tick_count, $$.isTimeSeries());
+ }
- // Draw with targets
- if (binding) {
- $$.updateDimension();
- $$.config.oninit.call($$);
- $$.redraw({
- withTransition: false,
- withTransform: true,
- withUpdateXDomain: true,
- withUpdateOrgXDomain: true,
- withTransitionForAxis: false
- });
- }
+ if (axis) {
+ axis.tickValues(tickValues);
+ } else {
+ $$.xAxis.tickValues(tickValues);
+ $$.subXAxis.tickValues(tickValues);
+ }
- // Bind resize event
- $$.bindResize();
+ return tickValues;
+ };
+
+ Axis.prototype.getYAxis = function getYAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText) {
+ var $$ = this.owner,
+ config = $$.config,
+ axisParams = {
+ withOuterTick: withOuterTick,
+ withoutTransition: withoutTransition,
+ tickTextRotate: withoutRotateTickText ? 0 : config.axis_y_tick_rotate
+ },
+ axis = new this.internal(this, axisParams).axis.scale(scale).orient(orient).tickFormat(tickFormat);
+
+ if ($$.isTimeSeriesY()) {
+ axis.ticks(config.axis_y_tick_time_type, config.axis_y_tick_time_interval);
+ } else {
+ axis.tickValues(tickValues);
+ }
- // export element of the chart
- $$.api.element = $$.selectChart.node();
- };
+ return axis;
+ };
+
+ Axis.prototype.getId = function getId(id) {
+ var config = this.owner.config;
+ return id in config.data_axes ? config.data_axes[id] : 'y';
+ };
+
+ Axis.prototype.getXAxisTickFormat = function getXAxisTickFormat() {
+ // #2251 previously set any negative values to a whole number,
+ // however both should be truncated according to the users format specification
+ var $$ = this.owner,
+ config = $$.config;
+ var format = $$.isTimeSeries() ? $$.defaultAxisTimeFormat : $$.isCategorized() ? $$.categoryName : function (v) {
+ return v;
+ };
+
+ if (config.axis_x_tick_format) {
+ if (isFunction(config.axis_x_tick_format)) {
+ format = config.axis_x_tick_format;
+ } else if ($$.isTimeSeries()) {
+ format = function format(date) {
+ return date ? $$.axisTimeFormat(config.axis_x_tick_format)(date) : "";
+ };
+ }
+ }
- ChartInternal.prototype.smoothLines = function (el, type) {
- var $$ = this;
- if (type === 'grid') {
- el.each(function () {
- var g = $$.d3.select(this),
- x1 = g.attr('x1'),
- x2 = g.attr('x2'),
- y1 = g.attr('y1'),
- y2 = g.attr('y2');
- g.attr({
- 'x1': Math.ceil(x1),
- 'x2': Math.ceil(x2),
- 'y1': Math.ceil(y1),
- 'y2': Math.ceil(y2)
- });
- });
- }
- };
+ return isFunction(format) ? function (v) {
+ return format.call($$, v);
+ } : format;
+ };
+
+ Axis.prototype.getTickValues = function getTickValues(tickValues, axis) {
+ return tickValues ? tickValues : axis ? axis.tickValues() : undefined;
+ };
+
+ Axis.prototype.getXAxisTickValues = function getXAxisTickValues() {
+ return this.getTickValues(this.owner.config.axis_x_tick_values, this.owner.xAxis);
+ };
+
+ Axis.prototype.getYAxisTickValues = function getYAxisTickValues() {
+ return this.getTickValues(this.owner.config.axis_y_tick_values, this.owner.yAxis);
+ };
+
+ Axis.prototype.getY2AxisTickValues = function getY2AxisTickValues() {
+ return this.getTickValues(this.owner.config.axis_y2_tick_values, this.owner.y2Axis);
+ };
+
+ Axis.prototype.getLabelOptionByAxisId = function getLabelOptionByAxisId(axisId) {
+ var $$ = this.owner,
+ config = $$.config,
+ option;
+
+ if (axisId === 'y') {
+ option = config.axis_y_label;
+ } else if (axisId === 'y2') {
+ option = config.axis_y2_label;
+ } else if (axisId === 'x') {
+ option = config.axis_x_label;
+ }
- ChartInternal.prototype.updateSizes = function () {
- var $$ = this,
- config = $$.config;
- var legendHeight = $$.legend ? $$.getLegendHeight() : 0,
- legendWidth = $$.legend ? $$.getLegendWidth() : 0,
- legendHeightForBottom = $$.isLegendRight || $$.isLegendInset ? 0 : legendHeight,
- hasArc = $$.hasArcType(),
- xAxisHeight = config.axis_rotated || hasArc ? 0 : $$.getHorizontalAxisHeight('x'),
- subchartHeight = config.subchart_show && !hasArc ? config.subchart_size_height + xAxisHeight : 0;
-
- $$.currentWidth = $$.getCurrentWidth();
- $$.currentHeight = $$.getCurrentHeight();
-
- // for main
- $$.margin = config.axis_rotated ? {
- top: $$.getHorizontalAxisHeight('y2') + $$.getCurrentPaddingTop(),
- right: hasArc ? 0 : $$.getCurrentPaddingRight(),
- bottom: $$.getHorizontalAxisHeight('y') + legendHeightForBottom + $$.getCurrentPaddingBottom(),
- left: subchartHeight + (hasArc ? 0 : $$.getCurrentPaddingLeft())
- } : {
- top: 4 + $$.getCurrentPaddingTop(), // for top tick text
- right: hasArc ? 0 : $$.getCurrentPaddingRight(),
- bottom: xAxisHeight + subchartHeight + legendHeightForBottom + $$.getCurrentPaddingBottom(),
- left: hasArc ? 0 : $$.getCurrentPaddingLeft()
- };
+ return option;
+ };
+
+ Axis.prototype.getLabelText = function getLabelText(axisId) {
+ var option = this.getLabelOptionByAxisId(axisId);
+ return isString(option) ? option : option ? option.text : null;
+ };
+
+ Axis.prototype.setLabelText = function setLabelText(axisId, text) {
+ var $$ = this.owner,
+ config = $$.config,
+ option = this.getLabelOptionByAxisId(axisId);
+
+ if (isString(option)) {
+ if (axisId === 'y') {
+ config.axis_y_label = text;
+ } else if (axisId === 'y2') {
+ config.axis_y2_label = text;
+ } else if (axisId === 'x') {
+ config.axis_x_label = text;
+ }
+ } else if (option) {
+ option.text = text;
+ }
+ };
+
+ Axis.prototype.getLabelPosition = function getLabelPosition(axisId, defaultPosition) {
+ var option = this.getLabelOptionByAxisId(axisId),
+ position = option && _typeof(option) === 'object' && option.position ? option.position : defaultPosition;
+ return {
+ isInner: position.indexOf('inner') >= 0,
+ isOuter: position.indexOf('outer') >= 0,
+ isLeft: position.indexOf('left') >= 0,
+ isCenter: position.indexOf('center') >= 0,
+ isRight: position.indexOf('right') >= 0,
+ isTop: position.indexOf('top') >= 0,
+ isMiddle: position.indexOf('middle') >= 0,
+ isBottom: position.indexOf('bottom') >= 0
+ };
+ };
+
+ Axis.prototype.getXAxisLabelPosition = function getXAxisLabelPosition() {
+ return this.getLabelPosition('x', this.owner.config.axis_rotated ? 'inner-top' : 'inner-right');
+ };
+
+ Axis.prototype.getYAxisLabelPosition = function getYAxisLabelPosition() {
+ return this.getLabelPosition('y', this.owner.config.axis_rotated ? 'inner-right' : 'inner-top');
+ };
+
+ Axis.prototype.getY2AxisLabelPosition = function getY2AxisLabelPosition() {
+ return this.getLabelPosition('y2', this.owner.config.axis_rotated ? 'inner-right' : 'inner-top');
+ };
+
+ Axis.prototype.getLabelPositionById = function getLabelPositionById(id) {
+ return id === 'y2' ? this.getY2AxisLabelPosition() : id === 'y' ? this.getYAxisLabelPosition() : this.getXAxisLabelPosition();
+ };
+
+ Axis.prototype.textForXAxisLabel = function textForXAxisLabel() {
+ return this.getLabelText('x');
+ };
+
+ Axis.prototype.textForYAxisLabel = function textForYAxisLabel() {
+ return this.getLabelText('y');
+ };
+
+ Axis.prototype.textForY2AxisLabel = function textForY2AxisLabel() {
+ return this.getLabelText('y2');
+ };
+
+ Axis.prototype.xForAxisLabel = function xForAxisLabel(forHorizontal, position) {
+ var $$ = this.owner;
+
+ if (forHorizontal) {
+ return position.isLeft ? 0 : position.isCenter ? $$.width / 2 : $$.width;
+ } else {
+ return position.isBottom ? -$$.height : position.isMiddle ? -$$.height / 2 : 0;
+ }
+ };
- // for subchart
- $$.margin2 = config.axis_rotated ? {
- top: $$.margin.top,
- right: NaN,
- bottom: 20 + legendHeightForBottom,
- left: $$.rotated_padding_left
- } : {
- top: $$.currentHeight - subchartHeight - legendHeightForBottom,
- right: NaN,
- bottom: xAxisHeight + legendHeightForBottom,
- left: $$.margin.left
- };
+ Axis.prototype.dxForAxisLabel = function dxForAxisLabel(forHorizontal, position) {
+ if (forHorizontal) {
+ return position.isLeft ? "0.5em" : position.isRight ? "-0.5em" : "0";
+ } else {
+ return position.isTop ? "-0.5em" : position.isBottom ? "0.5em" : "0";
+ }
+ };
- // for legend
- $$.margin3 = {
- top: 0,
- right: NaN,
- bottom: 0,
- left: 0
- };
- if ($$.updateSizeForLegend) {
- $$.updateSizeForLegend(legendHeight, legendWidth);
- }
+ Axis.prototype.textAnchorForAxisLabel = function textAnchorForAxisLabel(forHorizontal, position) {
+ if (forHorizontal) {
+ return position.isLeft ? 'start' : position.isCenter ? 'middle' : 'end';
+ } else {
+ return position.isBottom ? 'start' : position.isMiddle ? 'middle' : 'end';
+ }
+ };
- $$.width = $$.currentWidth - $$.margin.left - $$.margin.right;
- $$.height = $$.currentHeight - $$.margin.top - $$.margin.bottom;
- if ($$.width < 0) {
- $$.width = 0;
- }
- if ($$.height < 0) {
- $$.height = 0;
- }
+ Axis.prototype.xForXAxisLabel = function xForXAxisLabel() {
+ return this.xForAxisLabel(!this.owner.config.axis_rotated, this.getXAxisLabelPosition());
+ };
- $$.width2 = config.axis_rotated ? $$.margin.left - $$.rotated_padding_left - $$.rotated_padding_right : $$.width;
- $$.height2 = config.axis_rotated ? $$.height : $$.currentHeight - $$.margin2.top - $$.margin2.bottom;
- if ($$.width2 < 0) {
- $$.width2 = 0;
- }
- if ($$.height2 < 0) {
- $$.height2 = 0;
- }
+ Axis.prototype.xForYAxisLabel = function xForYAxisLabel() {
+ return this.xForAxisLabel(this.owner.config.axis_rotated, this.getYAxisLabelPosition());
+ };
- // for arc
- $$.arcWidth = $$.width - ($$.isLegendRight ? legendWidth + 10 : 0);
- $$.arcHeight = $$.height - ($$.isLegendRight ? 0 : 10);
- if ($$.hasType('gauge') && !config.gauge_fullCircle) {
- $$.arcHeight += $$.height - $$.getGaugeLabelHeight();
- }
- if ($$.updateRadius) {
- $$.updateRadius();
- }
+ Axis.prototype.xForY2AxisLabel = function xForY2AxisLabel() {
+ return this.xForAxisLabel(this.owner.config.axis_rotated, this.getY2AxisLabelPosition());
+ };
- if ($$.isLegendRight && hasArc) {
- $$.margin3.left = $$.arcWidth / 2 + $$.radiusExpanded * 1.1;
- }
- };
+ Axis.prototype.dxForXAxisLabel = function dxForXAxisLabel() {
+ return this.dxForAxisLabel(!this.owner.config.axis_rotated, this.getXAxisLabelPosition());
+ };
- ChartInternal.prototype.updateTargets = function (targets) {
- var $$ = this;
+ Axis.prototype.dxForYAxisLabel = function dxForYAxisLabel() {
+ return this.dxForAxisLabel(this.owner.config.axis_rotated, this.getYAxisLabelPosition());
+ };
- /*-- Main --*/
+ Axis.prototype.dxForY2AxisLabel = function dxForY2AxisLabel() {
+ return this.dxForAxisLabel(this.owner.config.axis_rotated, this.getY2AxisLabelPosition());
+ };
- //-- Text --//
- $$.updateTargetsForText(targets);
+ Axis.prototype.dyForXAxisLabel = function dyForXAxisLabel() {
+ var $$ = this.owner,
+ config = $$.config,
+ position = this.getXAxisLabelPosition();
- //-- Bar --//
- $$.updateTargetsForBar(targets);
+ if (config.axis_rotated) {
+ return position.isInner ? "1.2em" : -25 - ($$.config.axis_x_inner ? 0 : this.getMaxTickWidth('x'));
+ } else {
+ return position.isInner ? "-0.5em" : config.axis_x_height ? config.axis_x_height - 10 : "3em";
+ }
+ };
- //-- Line --//
- $$.updateTargetsForLine(targets);
+ Axis.prototype.dyForYAxisLabel = function dyForYAxisLabel() {
+ var $$ = this.owner,
+ position = this.getYAxisLabelPosition();
- //-- Arc --//
- if ($$.hasArcType() && $$.updateTargetsForArc) {
- $$.updateTargetsForArc(targets);
- }
+ if ($$.config.axis_rotated) {
+ return position.isInner ? "-0.5em" : "3em";
+ } else {
+ return position.isInner ? "1.2em" : -10 - ($$.config.axis_y_inner ? 0 : this.getMaxTickWidth('y') + 10);
+ }
+ };
- /*-- Sub --*/
+ Axis.prototype.dyForY2AxisLabel = function dyForY2AxisLabel() {
+ var $$ = this.owner,
+ position = this.getY2AxisLabelPosition();
- if ($$.updateTargetsForSubchart) {
- $$.updateTargetsForSubchart(targets);
- }
+ if ($$.config.axis_rotated) {
+ return position.isInner ? "1.2em" : "-2.2em";
+ } else {
+ return position.isInner ? "-0.5em" : 15 + ($$.config.axis_y2_inner ? 0 : this.getMaxTickWidth('y2') + 15);
+ }
+ };
+
+ Axis.prototype.textAnchorForXAxisLabel = function textAnchorForXAxisLabel() {
+ var $$ = this.owner;
+ return this.textAnchorForAxisLabel(!$$.config.axis_rotated, this.getXAxisLabelPosition());
+ };
+
+ Axis.prototype.textAnchorForYAxisLabel = function textAnchorForYAxisLabel() {
+ var $$ = this.owner;
+ return this.textAnchorForAxisLabel($$.config.axis_rotated, this.getYAxisLabelPosition());
+ };
+
+ Axis.prototype.textAnchorForY2AxisLabel = function textAnchorForY2AxisLabel() {
+ var $$ = this.owner;
+ return this.textAnchorForAxisLabel($$.config.axis_rotated, this.getY2AxisLabelPosition());
+ };
+
+ Axis.prototype.getMaxTickWidth = function getMaxTickWidth(id, withoutRecompute) {
+ var $$ = this.owner,
+ config = $$.config,
+ maxWidth = 0,
+ targetsToShow,
+ scale,
+ axis,
+ dummy,
+ svg;
+
+ if (withoutRecompute && $$.currentMaxTickWidths[id]) {
+ return $$.currentMaxTickWidths[id];
+ }
- // Fade-in each chart
- $$.showTargets();
- };
- ChartInternal.prototype.showTargets = function () {
- var $$ = this;
- $$.svg.selectAll('.' + CLASS.target).filter(function (d) {
- return $$.isTargetToShow(d.id);
- }).transition().duration($$.config.transition_duration).style("opacity", 1);
- };
+ if ($$.svg) {
+ targetsToShow = $$.filterTargetsToShow($$.data.targets);
- ChartInternal.prototype.redraw = function (options, transitions) {
- var $$ = this,
- main = $$.main,
- d3 = $$.d3,
- config = $$.config;
- var areaIndices = $$.getShapeIndices($$.isAreaType),
- barIndices = $$.getShapeIndices($$.isBarType),
- lineIndices = $$.getShapeIndices($$.isLineType);
- var withY, withSubchart, withTransition, withTransitionForExit, withTransitionForAxis, withTransform, withUpdateXDomain, withUpdateOrgXDomain, withTrimXDomain, withLegend, withEventRect, withDimension, withUpdateXAxis;
- var hideAxis = $$.hasArcType();
- var drawArea, drawBar, drawLine, xForText, yForText;
- var duration, durationForExit, durationForAxis;
- var transitionsToWait, waitForDraw, flow, transition;
- var targetsToShow = $$.filterTargetsToShow($$.data.targets),
- tickValues,
- i,
- intervalForCulling,
- xDomainForZoom;
- var xv = $$.xv.bind($$),
- cx,
- cy;
-
- options = options || {};
- withY = getOption(options, "withY", true);
- withSubchart = getOption(options, "withSubchart", true);
- withTransition = getOption(options, "withTransition", true);
- withTransform = getOption(options, "withTransform", false);
- withUpdateXDomain = getOption(options, "withUpdateXDomain", false);
- withUpdateOrgXDomain = getOption(options, "withUpdateOrgXDomain", false);
- withTrimXDomain = getOption(options, "withTrimXDomain", true);
- withUpdateXAxis = getOption(options, "withUpdateXAxis", withUpdateXDomain);
- withLegend = getOption(options, "withLegend", false);
- withEventRect = getOption(options, "withEventRect", true);
- withDimension = getOption(options, "withDimension", true);
- withTransitionForExit = getOption(options, "withTransitionForExit", withTransition);
- withTransitionForAxis = getOption(options, "withTransitionForAxis", withTransition);
-
- duration = withTransition ? config.transition_duration : 0;
- durationForExit = withTransitionForExit ? duration : 0;
- durationForAxis = withTransitionForAxis ? duration : 0;
-
- transitions = transitions || $$.axis.generateTransitions(durationForAxis);
-
- // update legend and transform each g
- if (withLegend && config.legend_show) {
- $$.updateLegend($$.mapToIds($$.data.targets), options, transitions);
- } else if (withDimension) {
- // need to update dimension (e.g. axis.y.tick.values) because y tick values should change
- // no need to update axis in it because they will be updated in redraw()
- $$.updateDimension(true);
- }
+ if (id === 'y') {
+ scale = $$.y.copy().domain($$.getYDomain(targetsToShow, 'y'));
+ axis = this.getYAxis(scale, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, false, true, true);
+ } else if (id === 'y2') {
+ scale = $$.y2.copy().domain($$.getYDomain(targetsToShow, 'y2'));
+ axis = this.getYAxis(scale, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, false, true, true);
+ } else {
+ scale = $$.x.copy().domain($$.getXDomain(targetsToShow));
+ axis = this.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, false, true, true);
+ this.updateXAxisTickValues(targetsToShow, axis);
+ }
- // MEMO: needed for grids calculation
- if ($$.isCategorized() && targetsToShow.length === 0) {
- $$.x.domain([0, $$.axes.x.selectAll('.tick').size()]);
- }
+ dummy = $$.d3.select('body').append('div').classed('c3', true);
+ svg = dummy.append("svg").style('visibility', 'hidden').style('position', 'fixed').style('top', 0).style('left', 0), svg.append('g').call(axis).each(function () {
+ $$.d3.select(this).selectAll('text').each(function () {
+ var box = this.getBoundingClientRect();
- if (targetsToShow.length) {
- $$.updateXDomain(targetsToShow, withUpdateXDomain, withUpdateOrgXDomain, withTrimXDomain);
- if (!config.axis_x_tick_values) {
- tickValues = $$.axis.updateXAxisTickValues(targetsToShow);
- }
- } else {
- $$.xAxis.tickValues([]);
- $$.subXAxis.tickValues([]);
- }
+ if (maxWidth < box.width) {
+ maxWidth = box.width;
+ }
+ });
+ dummy.remove();
+ });
+ }
- if (config.zoom_rescale && !options.flow) {
- xDomainForZoom = $$.x.orgDomain();
- }
+ $$.currentMaxTickWidths[id] = maxWidth <= 0 ? $$.currentMaxTickWidths[id] : maxWidth;
+ return $$.currentMaxTickWidths[id];
+ };
+
+ Axis.prototype.updateLabels = function updateLabels(withTransition) {
+ var $$ = this.owner;
+ var axisXLabel = $$.main.select('.' + CLASS.axisX + ' .' + CLASS.axisXLabel),
+ axisYLabel = $$.main.select('.' + CLASS.axisY + ' .' + CLASS.axisYLabel),
+ axisY2Label = $$.main.select('.' + CLASS.axisY2 + ' .' + CLASS.axisY2Label);
+ (withTransition ? axisXLabel.transition() : axisXLabel).attr("x", this.xForXAxisLabel.bind(this)).attr("dx", this.dxForXAxisLabel.bind(this)).attr("dy", this.dyForXAxisLabel.bind(this)).text(this.textForXAxisLabel.bind(this));
+ (withTransition ? axisYLabel.transition() : axisYLabel).attr("x", this.xForYAxisLabel.bind(this)).attr("dx", this.dxForYAxisLabel.bind(this)).attr("dy", this.dyForYAxisLabel.bind(this)).text(this.textForYAxisLabel.bind(this));
+ (withTransition ? axisY2Label.transition() : axisY2Label).attr("x", this.xForY2AxisLabel.bind(this)).attr("dx", this.dxForY2AxisLabel.bind(this)).attr("dy", this.dyForY2AxisLabel.bind(this)).text(this.textForY2AxisLabel.bind(this));
+ };
+
+ Axis.prototype.getPadding = function getPadding(padding, key, defaultValue, domainLength) {
+ var p = typeof padding === 'number' ? padding : padding[key];
+
+ if (!isValue(p)) {
+ return defaultValue;
+ }
- $$.y.domain($$.getYDomain(targetsToShow, 'y', xDomainForZoom));
- $$.y2.domain($$.getYDomain(targetsToShow, 'y2', xDomainForZoom));
+ if (padding.unit === 'ratio') {
+ return padding[key] * domainLength;
+ } // assume padding is pixels if unit is not specified
- if (!config.axis_y_tick_values && config.axis_y_tick_count) {
- $$.yAxis.tickValues($$.axis.generateTickValues($$.y.domain(), config.axis_y_tick_count));
- }
- if (!config.axis_y2_tick_values && config.axis_y2_tick_count) {
- $$.y2Axis.tickValues($$.axis.generateTickValues($$.y2.domain(), config.axis_y2_tick_count));
- }
- // axes
- $$.axis.redraw(durationForAxis, hideAxis);
-
- // Update axis label
- $$.axis.updateLabels(withTransition);
-
- // show/hide if manual culling needed
- if ((withUpdateXDomain || withUpdateXAxis) && targetsToShow.length) {
- if (config.axis_x_tick_culling && tickValues) {
- for (i = 1; i < tickValues.length; i++) {
- if (tickValues.length / i < config.axis_x_tick_culling_max) {
- intervalForCulling = i;
- break;
- }
- }
- $$.svg.selectAll('.' + CLASS.axisX + ' .tick text').each(function (e) {
- var index = tickValues.indexOf(e);
- if (index >= 0) {
- d3.select(this).style('display', index % intervalForCulling ? 'none' : 'block');
- }
- });
- } else {
- $$.svg.selectAll('.' + CLASS.axisX + ' .tick text').style('display', 'block');
- }
- }
+ return this.convertPixelsToAxisPadding(p, domainLength);
+ };
- // setup drawer - MEMO: these must be called after axis updated
- drawArea = $$.generateDrawArea ? $$.generateDrawArea(areaIndices, false) : undefined;
- drawBar = $$.generateDrawBar ? $$.generateDrawBar(barIndices) : undefined;
- drawLine = $$.generateDrawLine ? $$.generateDrawLine(lineIndices, false) : undefined;
- xForText = $$.generateXYForText(areaIndices, barIndices, lineIndices, true);
- yForText = $$.generateXYForText(areaIndices, barIndices, lineIndices, false);
-
- // update circleY based on updated parameters
- $$.updateCircleY();
- // generate circle x/y functions depending on updated params
- cx = ($$.config.axis_rotated ? $$.circleY : $$.circleX).bind($$);
- cy = ($$.config.axis_rotated ? $$.circleX : $$.circleY).bind($$);
-
- // Update sub domain
- if (withY) {
- $$.subY.domain($$.getYDomain(targetsToShow, 'y'));
- $$.subY2.domain($$.getYDomain(targetsToShow, 'y2'));
- }
+ Axis.prototype.convertPixelsToAxisPadding = function convertPixelsToAxisPadding(pixels, domainLength) {
+ var $$ = this.owner,
+ length = $$.config.axis_rotated ? $$.width : $$.height;
+ return domainLength * (pixels / length);
+ };
- // xgrid focus
- $$.updateXgridFocus();
+ Axis.prototype.generateTickValues = function generateTickValues(values, tickCount, forTimeSeries) {
+ var tickValues = values,
+ targetCount,
+ start,
+ end,
+ count,
+ interval,
+ i,
+ tickValue;
- // Data empty label positioning and text.
- main.select("text." + CLASS.text + '.' + CLASS.empty).attr("x", $$.width / 2).attr("y", $$.height / 2).text(config.data_empty_label_text).transition().style('opacity', targetsToShow.length ? 0 : 1);
+ if (tickCount) {
+ targetCount = isFunction(tickCount) ? tickCount() : tickCount; // compute ticks according to tickCount
- // event rect
- if (withEventRect) {
- $$.redrawEventRect();
- }
+ if (targetCount === 1) {
+ tickValues = [values[0]];
+ } else if (targetCount === 2) {
+ tickValues = [values[0], values[values.length - 1]];
+ } else if (targetCount > 2) {
+ count = targetCount - 2;
+ start = values[0];
+ end = values[values.length - 1];
+ interval = (end - start) / (count + 1); // re-construct unique values
- // grid
- $$.updateGrid(duration);
+ tickValues = [start];
- // rect for regions
- $$.updateRegion(duration);
+ for (i = 0; i < count; i++) {
+ tickValue = +start + interval * (i + 1);
+ tickValues.push(forTimeSeries ? new Date(tickValue) : tickValue);
+ }
- // bars
- $$.updateBar(durationForExit);
+ tickValues.push(end);
+ }
+ }
- // lines, areas and cricles
- $$.updateLine(durationForExit);
- $$.updateArea(durationForExit);
- $$.updateCircle(cx, cy);
+ if (!forTimeSeries) {
+ tickValues = tickValues.sort(function (a, b) {
+ return a - b;
+ });
+ }
- // text
- if ($$.hasDataLabel()) {
- $$.updateText(xForText, yForText, durationForExit);
+ return tickValues;
+ };
+
+ Axis.prototype.generateTransitions = function generateTransitions(duration) {
+ var $$ = this.owner,
+ axes = $$.axes;
+ return {
+ axisX: duration ? axes.x.transition().duration(duration) : axes.x,
+ axisY: duration ? axes.y.transition().duration(duration) : axes.y,
+ axisY2: duration ? axes.y2.transition().duration(duration) : axes.y2,
+ axisSubX: duration ? axes.subx.transition().duration(duration) : axes.subx
+ };
+ };
+
+ Axis.prototype.redraw = function redraw(duration, isHidden) {
+ var $$ = this.owner,
+ transition = duration ? $$.d3.transition().duration(duration) : null;
+ $$.axes.x.style("opacity", isHidden ? 0 : 1).call($$.xAxis, transition);
+ $$.axes.y.style("opacity", isHidden ? 0 : 1).call($$.yAxis, transition);
+ $$.axes.y2.style("opacity", isHidden ? 0 : 1).call($$.y2Axis, transition);
+ $$.axes.subx.style("opacity", isHidden ? 0 : 1).call($$.subXAxis, transition);
+ };
+
+ var c3 = {
+ version: "0.6.9",
+ chart: {
+ fn: Chart.prototype,
+ internal: {
+ fn: ChartInternal.prototype,
+ axis: {
+ fn: Axis.prototype,
+ internal: {
+ fn: AxisInternal.prototype
+ }
}
+ }
+ },
+ generate: function generate(config) {
+ return new Chart(config);
+ }
+ };
+
+ ChartInternal.prototype.beforeInit = function () {// can do something
+ };
+
+ ChartInternal.prototype.afterInit = function () {// can do something
+ };
+
+ ChartInternal.prototype.init = function () {
+ var $$ = this,
+ config = $$.config;
+ $$.initParams();
+
+ if (config.data_url) {
+ $$.convertUrlToData(config.data_url, config.data_mimeType, config.data_headers, config.data_keys, $$.initWithData);
+ } else if (config.data_json) {
+ $$.initWithData($$.convertJsonToData(config.data_json, config.data_keys));
+ } else if (config.data_rows) {
+ $$.initWithData($$.convertRowsToData(config.data_rows));
+ } else if (config.data_columns) {
+ $$.initWithData($$.convertColumnsToData(config.data_columns));
+ } else {
+ throw Error('url or json or rows or columns is required.');
+ }
+ };
+
+ ChartInternal.prototype.initParams = function () {
+ var $$ = this,
+ d3 = $$.d3,
+ config = $$.config; // MEMO: clipId needs to be unique because it conflicts when multiple charts exist
+
+ $$.clipId = "c3-" + +new Date() + '-clip';
+ $$.clipIdForXAxis = $$.clipId + '-xaxis';
+ $$.clipIdForYAxis = $$.clipId + '-yaxis';
+ $$.clipIdForGrid = $$.clipId + '-grid';
+ $$.clipIdForSubchart = $$.clipId + '-subchart';
+ $$.clipPath = $$.getClipPath($$.clipId);
+ $$.clipPathForXAxis = $$.getClipPath($$.clipIdForXAxis);
+ $$.clipPathForYAxis = $$.getClipPath($$.clipIdForYAxis);
+ $$.clipPathForGrid = $$.getClipPath($$.clipIdForGrid);
+ $$.clipPathForSubchart = $$.getClipPath($$.clipIdForSubchart);
+ $$.dragStart = null;
+ $$.dragging = false;
+ $$.flowing = false;
+ $$.cancelClick = false;
+ $$.mouseover = false;
+ $$.transiting = false;
+ $$.color = $$.generateColor();
+ $$.levelColor = $$.generateLevelColor();
+ $$.dataTimeParse = (config.data_xLocaltime ? d3.timeParse : d3.utcParse)($$.config.data_xFormat);
+ $$.axisTimeFormat = config.axis_x_localtime ? d3.timeFormat : d3.utcFormat;
+
+ $$.defaultAxisTimeFormat = function (date) {
+ if (date.getMilliseconds()) {
+ return d3.timeFormat(".%L")(date);
+ }
- // title
- if ($$.redrawTitle) {
- $$.redrawTitle();
- }
+ if (date.getSeconds()) {
+ return d3.timeFormat(":%S")(date);
+ }
- // arc
- if ($$.redrawArc) {
- $$.redrawArc(duration, durationForExit, withTransform);
- }
+ if (date.getMinutes()) {
+ return d3.timeFormat("%I:%M")(date);
+ }
- // subchart
- if ($$.redrawSubchart) {
- $$.redrawSubchart(withSubchart, transitions, duration, durationForExit, areaIndices, barIndices, lineIndices);
- }
+ if (date.getHours()) {
+ return d3.timeFormat("%I %p")(date);
+ }
- // circles for select
- main.selectAll('.' + CLASS.selectedCircles).filter($$.isBarType.bind($$)).selectAll('circle').remove();
-
- if (options.flow) {
- flow = $$.generateFlow({
- targets: targetsToShow,
- flow: options.flow,
- duration: options.flow.duration,
- drawBar: drawBar,
- drawLine: drawLine,
- drawArea: drawArea,
- cx: cx,
- cy: cy,
- xv: xv,
- xForText: xForText,
- yForText: yForText
- });
- }
+ if (date.getDay() && date.getDate() !== 1) {
+ return d3.timeFormat("%-m/%-d")(date);
+ }
- if ($$.isTabVisible()) {
- // Only use transition if tab visible. See #938.
- if (duration) {
- // transition should be derived from one transition
- transition = d3.transition().duration(duration);
- transitionsToWait = [];
- [$$.redrawBar(drawBar, true, transition), $$.redrawLine(drawLine, true, transition), $$.redrawArea(drawArea, true, transition), $$.redrawCircle(cx, cy, true, transition), $$.redrawText(xForText, yForText, options.flow, true, transition), $$.redrawRegion(true, transition), $$.redrawGrid(true, transition)].forEach(function (transitions) {
- transitions.forEach(function (transition) {
- transitionsToWait.push(transition);
- });
- });
- // Wait for end of transitions to call flow and onrendered callback
- waitForDraw = $$.generateWait();
- transitionsToWait.forEach(function (t) {
- waitForDraw.add(t);
- });
- waitForDraw(function () {
- if (flow) {
- flow();
- }
- if (config.onrendered) {
- config.onrendered.call($$);
- }
- });
- } else {
- $$.redrawBar(drawBar);
- $$.redrawLine(drawLine);
- $$.redrawArea(drawArea);
- $$.redrawCircle(cx, cy);
- $$.redrawText(xForText, yForText, options.flow);
- $$.redrawRegion();
- $$.redrawGrid();
- if (flow) {
- flow();
- }
- if (config.onrendered) {
- config.onrendered.call($$);
- }
- }
- }
+ if (date.getDate() !== 1) {
+ return d3.timeFormat("%-m/%-d")(date);
+ }
- // update fadein condition
- $$.mapToIds($$.data.targets).forEach(function (id) {
- $$.withoutFadeIn[id] = true;
- });
- };
+ if (date.getMonth()) {
+ return d3.timeFormat("%-m/%-d")(date);
+ }
- ChartInternal.prototype.updateAndRedraw = function (options) {
- var $$ = this,
- config = $$.config,
- transitions;
- options = options || {};
- // same with redraw
- options.withTransition = getOption(options, "withTransition", true);
- options.withTransform = getOption(options, "withTransform", false);
- options.withLegend = getOption(options, "withLegend", false);
- // NOT same with redraw
- options.withUpdateXDomain = getOption(options, "withUpdateXDomain", true);
- options.withUpdateOrgXDomain = getOption(options, "withUpdateOrgXDomain", true);
- options.withTransitionForExit = false;
- options.withTransitionForTransform = getOption(options, "withTransitionForTransform", options.withTransition);
- // MEMO: this needs to be called before updateLegend and it means this ALWAYS needs to be called)
- $$.updateSizes();
- // MEMO: called in updateLegend in redraw if withLegend
- if (!(options.withLegend && config.legend_show)) {
- transitions = $$.axis.generateTransitions(options.withTransitionForAxis ? config.transition_duration : 0);
- // Update scales
- $$.updateScales();
- $$.updateSvgSize();
- // Update g positions
- $$.transformAll(options.withTransitionForTransform, transitions);
- }
- // Draw with new sizes & scales
- $$.redraw(options, transitions);
- };
- ChartInternal.prototype.redrawWithoutRescale = function () {
- this.redraw({
- withY: false,
- withSubchart: false,
- withEventRect: false,
- withTransitionForAxis: false
- });
- };
+ return d3.timeFormat("%Y/%-m/%-d")(date);
+ };
+
+ $$.hiddenTargetIds = [];
+ $$.hiddenLegendIds = [];
+ $$.focusedTargetIds = [];
+ $$.defocusedTargetIds = [];
+ $$.xOrient = config.axis_rotated ? config.axis_x_inner ? "right" : "left" : config.axis_x_inner ? "top" : "bottom";
+ $$.yOrient = config.axis_rotated ? config.axis_y_inner ? "top" : "bottom" : config.axis_y_inner ? "right" : "left";
+ $$.y2Orient = config.axis_rotated ? config.axis_y2_inner ? "bottom" : "top" : config.axis_y2_inner ? "left" : "right";
+ $$.subXOrient = config.axis_rotated ? "left" : "bottom";
+ $$.isLegendRight = config.legend_position === 'right';
+ $$.isLegendInset = config.legend_position === 'inset';
+ $$.isLegendTop = config.legend_inset_anchor === 'top-left' || config.legend_inset_anchor === 'top-right';
+ $$.isLegendLeft = config.legend_inset_anchor === 'top-left' || config.legend_inset_anchor === 'bottom-left';
+ $$.legendStep = 0;
+ $$.legendItemWidth = 0;
+ $$.legendItemHeight = 0;
+ $$.currentMaxTickWidths = {
+ x: 0,
+ y: 0,
+ y2: 0
+ };
+ $$.rotated_padding_left = 30;
+ $$.rotated_padding_right = config.axis_rotated && !config.axis_x_show ? 0 : 30;
+ $$.rotated_padding_top = 5;
+ $$.withoutFadeIn = {};
+ $$.intervalForObserveInserted = undefined;
+ $$.axes.subx = d3.selectAll([]); // needs when excluding subchart.js
+ };
+
+ ChartInternal.prototype.initChartElements = function () {
+ if (this.initBar) {
+ this.initBar();
+ }
- ChartInternal.prototype.isTimeSeries = function () {
- return this.config.axis_x_type === 'timeseries';
- };
- ChartInternal.prototype.isCategorized = function () {
- return this.config.axis_x_type.indexOf('categor') >= 0;
- };
- ChartInternal.prototype.isCustomX = function () {
- var $$ = this,
- config = $$.config;
- return !$$.isTimeSeries() && (config.data_x || notEmpty(config.data_xs));
- };
+ if (this.initLine) {
+ this.initLine();
+ }
- ChartInternal.prototype.isTimeSeriesY = function () {
- return this.config.axis_y_type === 'timeseries';
- };
+ if (this.initArc) {
+ this.initArc();
+ }
- ChartInternal.prototype.getTranslate = function (target) {
- var $$ = this,
- config = $$.config,
- x,
- y;
- if (target === 'main') {
- x = asHalfPixel($$.margin.left);
- y = asHalfPixel($$.margin.top);
- } else if (target === 'context') {
- x = asHalfPixel($$.margin2.left);
- y = asHalfPixel($$.margin2.top);
- } else if (target === 'legend') {
- x = $$.margin3.left;
- y = $$.margin3.top;
- } else if (target === 'x') {
- x = 0;
- y = config.axis_rotated ? 0 : $$.height;
- } else if (target === 'y') {
- x = 0;
- y = config.axis_rotated ? $$.height : 0;
- } else if (target === 'y2') {
- x = config.axis_rotated ? 0 : $$.width;
- y = config.axis_rotated ? 1 : 0;
- } else if (target === 'subx') {
- x = 0;
- y = config.axis_rotated ? 0 : $$.height2;
- } else if (target === 'arc') {
- x = $$.arcWidth / 2;
- y = $$.arcHeight / 2 - ($$.hasType('gauge') ? 6 : 0); // to prevent wrong display of min and max label
- }
- return "translate(" + x + "," + y + ")";
- };
- ChartInternal.prototype.initialOpacity = function (d) {
- return d.value !== null && this.withoutFadeIn[d.id] ? 1 : 0;
- };
- ChartInternal.prototype.initialOpacityForCircle = function (d) {
- return d.value !== null && this.withoutFadeIn[d.id] ? this.opacityForCircle(d) : 0;
- };
- ChartInternal.prototype.opacityForCircle = function (d) {
- var isPointShouldBeShown = isFunction(this.config.point_show) ? this.config.point_show(d) : this.config.point_show;
- var opacity = isPointShouldBeShown ? 1 : 0;
- return isValue(d.value) ? this.isScatterType(d) ? 0.5 : opacity : 0;
- };
- ChartInternal.prototype.opacityForText = function () {
- return this.hasDataLabel() ? 1 : 0;
- };
- ChartInternal.prototype.xx = function (d) {
- return d ? this.x(d.x) : null;
- };
- ChartInternal.prototype.xv = function (d) {
- var $$ = this,
- value = d.value;
- if ($$.isTimeSeries()) {
- value = $$.parseDate(d.value);
- } else if ($$.isCategorized() && typeof d.value === 'string') {
- value = $$.config.axis_x_categories.indexOf(d.value);
- }
- return Math.ceil($$.x(value));
- };
- ChartInternal.prototype.yv = function (d) {
- var $$ = this,
- yScale = d.axis && d.axis === 'y2' ? $$.y2 : $$.y;
- return Math.ceil(yScale(d.value));
- };
- ChartInternal.prototype.subxx = function (d) {
- return d ? this.subX(d.x) : null;
- };
+ if (this.initGauge) {
+ this.initGauge();
+ }
- ChartInternal.prototype.transformMain = function (withTransition, transitions) {
- var $$ = this,
- xAxis,
- yAxis,
- y2Axis;
- if (transitions && transitions.axisX) {
- xAxis = transitions.axisX;
- } else {
- xAxis = $$.main.select('.' + CLASS.axisX);
- if (withTransition) {
- xAxis = xAxis.transition();
- }
- }
- if (transitions && transitions.axisY) {
- yAxis = transitions.axisY;
- } else {
- yAxis = $$.main.select('.' + CLASS.axisY);
- if (withTransition) {
- yAxis = yAxis.transition();
- }
- }
- if (transitions && transitions.axisY2) {
- y2Axis = transitions.axisY2;
- } else {
- y2Axis = $$.main.select('.' + CLASS.axisY2);
- if (withTransition) {
- y2Axis = y2Axis.transition();
- }
- }
- (withTransition ? $$.main.transition() : $$.main).attr("transform", $$.getTranslate('main'));
- xAxis.attr("transform", $$.getTranslate('x'));
- yAxis.attr("transform", $$.getTranslate('y'));
- y2Axis.attr("transform", $$.getTranslate('y2'));
- $$.main.select('.' + CLASS.chartArcs).attr("transform", $$.getTranslate('arc'));
- };
- ChartInternal.prototype.transformAll = function (withTransition, transitions) {
- var $$ = this;
- $$.transformMain(withTransition, transitions);
- if ($$.config.subchart_show) {
- $$.transformContext(withTransition, transitions);
- }
- if ($$.legend) {
- $$.transformLegend(withTransition);
- }
- };
+ if (this.initText) {
+ this.initText();
+ }
+ };
+
+ ChartInternal.prototype.initWithData = function (data) {
+ var $$ = this,
+ d3 = $$.d3,
+ config = $$.config;
+ var defs,
+ main,
+ binding = true;
+ $$.axis = new Axis($$);
+
+ if (!config.bindto) {
+ $$.selectChart = d3.selectAll([]);
+ } else if (typeof config.bindto.node === 'function') {
+ $$.selectChart = config.bindto;
+ } else {
+ $$.selectChart = d3.select(config.bindto);
+ }
- ChartInternal.prototype.updateSvgSize = function () {
- var $$ = this,
- brush = $$.svg.select(".c3-brush .overlay");
- $$.svg.attr('width', $$.currentWidth).attr('height', $$.currentHeight);
- $$.svg.selectAll(['#' + $$.clipId, '#' + $$.clipIdForGrid]).select('rect').attr('width', $$.width).attr('height', $$.height);
- $$.svg.select('#' + $$.clipIdForXAxis).select('rect').attr('x', $$.getXAxisClipX.bind($$)).attr('y', $$.getXAxisClipY.bind($$)).attr('width', $$.getXAxisClipWidth.bind($$)).attr('height', $$.getXAxisClipHeight.bind($$));
- $$.svg.select('#' + $$.clipIdForYAxis).select('rect').attr('x', $$.getYAxisClipX.bind($$)).attr('y', $$.getYAxisClipY.bind($$)).attr('width', $$.getYAxisClipWidth.bind($$)).attr('height', $$.getYAxisClipHeight.bind($$));
- $$.svg.select('#' + $$.clipIdForSubchart).select('rect').attr('width', $$.width).attr('height', brush.size() ? brush.attr('height') : 0);
- // MEMO: parent div's height will be bigger than svg when <!DOCTYPE html>
- $$.selectChart.style('max-height', $$.currentHeight + "px");
- };
+ if ($$.selectChart.empty()) {
+ $$.selectChart = d3.select(document.createElement('div')).style('opacity', 0);
+ $$.observeInserted($$.selectChart);
+ binding = false;
+ }
- ChartInternal.prototype.updateDimension = function (withoutAxis) {
- var $$ = this;
- if (!withoutAxis) {
- if ($$.config.axis_rotated) {
- $$.axes.x.call($$.xAxis);
- $$.axes.subx.call($$.subXAxis);
- } else {
- $$.axes.y.call($$.yAxis);
- $$.axes.y2.call($$.y2Axis);
- }
- }
- $$.updateSizes();
- $$.updateScales();
- $$.updateSvgSize();
- $$.transformAll(false);
- };
+ $$.selectChart.html("").classed("c3", true); // Init data as targets
- ChartInternal.prototype.observeInserted = function (selection) {
- var $$ = this,
- observer;
- if (typeof MutationObserver === 'undefined') {
- window.console.error("MutationObserver not defined.");
- return;
- }
- observer = new MutationObserver(function (mutations) {
- mutations.forEach(function (mutation) {
- if (mutation.type === 'childList' && mutation.previousSibling) {
- observer.disconnect();
- // need to wait for completion of load because size calculation requires the actual sizes determined after that completion
- $$.intervalForObserveInserted = window.setInterval(function () {
- // parentNode will NOT be null when completed
- if (selection.node().parentNode) {
- window.clearInterval($$.intervalForObserveInserted);
- $$.updateDimension();
- if ($$.brush) {
- $$.brush.update();
- }
- $$.config.oninit.call($$);
- $$.redraw({
- withTransform: true,
- withUpdateXDomain: true,
- withUpdateOrgXDomain: true,
- withTransition: false,
- withTransitionForTransform: false,
- withLegend: true
- });
- selection.transition().style('opacity', 1);
- }
- }, 10);
- }
- });
- });
- observer.observe(selection.node(), {
- attributes: true,
- childList: true,
- characterData: true
- });
- };
+ $$.data.xs = {};
+ $$.data.targets = $$.convertDataToTargets(data);
- ChartInternal.prototype.bindResize = function () {
- var $$ = this,
- config = $$.config;
+ if (config.data_filter) {
+ $$.data.targets = $$.data.targets.filter(config.data_filter);
+ } // Set targets to hide if needed
- $$.resizeFunction = $$.generateResize(); // need to call .remove
- $$.resizeFunction.add(function () {
- config.onresize.call($$);
- });
- if (config.resize_auto) {
- $$.resizeFunction.add(function () {
- if ($$.resizeTimeout !== undefined) {
- window.clearTimeout($$.resizeTimeout);
- }
- $$.resizeTimeout = window.setTimeout(function () {
- delete $$.resizeTimeout;
- $$.updateAndRedraw({
- withUpdateXDomain: false,
- withUpdateOrgXDomain: false,
- withTransition: false,
- withTransitionForTransform: false,
- withLegend: true
- });
- if ($$.brush) {
- $$.brush.update();
- }
- }, 100);
- });
- }
- $$.resizeFunction.add(function () {
- config.onresized.call($$);
- });
+ if (config.data_hide) {
+ $$.addHiddenTargetIds(config.data_hide === true ? $$.mapToIds($$.data.targets) : config.data_hide);
+ }
- $$.resizeIfElementDisplayed = function () {
- // if element not displayed skip it
- if ($$.api == null || !$$.api.element.offsetParent) {
- return;
- }
+ if (config.legend_hide) {
+ $$.addHiddenLegendIds(config.legend_hide === true ? $$.mapToIds($$.data.targets) : config.legend_hide);
+ } // Init sizes and scales
- $$.resizeFunction();
- };
- if (window.attachEvent) {
- window.attachEvent('onresize', $$.resizeIfElementDisplayed);
- } else if (window.addEventListener) {
- window.addEventListener('resize', $$.resizeIfElementDisplayed, false);
- } else {
- // fallback to this, if this is a very old browser
- var wrapper = window.onresize;
- if (!wrapper) {
- // create a wrapper that will call all charts
- wrapper = $$.generateResize();
- } else if (!wrapper.add || !wrapper.remove) {
- // there is already a handler registered, make sure we call it too
- wrapper = $$.generateResize();
- wrapper.add(window.onresize);
- }
- // add this graph to the wrapper, we will be removed if the user calls destroy
- wrapper.add($$.resizeFunction);
- window.onresize = function () {
- // if element not displayed skip it
- if (!$$.api.element.offsetParent) {
- return;
- }
-
- wrapper();
- };
- }
- };
+ $$.updateSizes();
+ $$.updateScales(); // Set domains for each scale
- ChartInternal.prototype.generateResize = function () {
- var resizeFunctions = [];
+ $$.x.domain(d3.extent($$.getXDomain($$.data.targets)));
+ $$.y.domain($$.getYDomain($$.data.targets, 'y'));
+ $$.y2.domain($$.getYDomain($$.data.targets, 'y2'));
+ $$.subX.domain($$.x.domain());
+ $$.subY.domain($$.y.domain());
+ $$.subY2.domain($$.y2.domain()); // Save original x domain for zoom update
- function callResizeFunctions() {
- resizeFunctions.forEach(function (f) {
- f();
- });
- }
- callResizeFunctions.add = function (f) {
- resizeFunctions.push(f);
- };
- callResizeFunctions.remove = function (f) {
- for (var i = 0; i < resizeFunctions.length; i++) {
- if (resizeFunctions[i] === f) {
- resizeFunctions.splice(i, 1);
- break;
- }
- }
- };
- return callResizeFunctions;
- };
+ $$.orgXDomain = $$.x.domain();
+ /*-- Basic Elements --*/
+ // Define svgs
- ChartInternal.prototype.endall = function (transition, callback) {
- var n = 0;
- transition.each(function () {
- ++n;
- }).on("end", function () {
- if (! --n) {
- callback.apply(this, arguments);
- }
- });
- };
- ChartInternal.prototype.generateWait = function () {
- var transitionsToWait = [],
- f = function f(callback) {
- var timer = setInterval(function () {
- var done = 0;
- transitionsToWait.forEach(function (t) {
- if (t.empty()) {
- done += 1;
- return;
- }
- try {
- t.transition();
- } catch (e) {
- done += 1;
- }
- });
- if (done === transitionsToWait.length) {
- clearInterval(timer);
- if (callback) {
- callback();
- }
- }
- }, 50);
- };
- f.add = function (transition) {
- transitionsToWait.push(transition);
- };
- return f;
- };
+ $$.svg = $$.selectChart.append("svg").style("overflow", "hidden").on('mouseenter', function () {
+ return config.onmouseover.call($$);
+ }).on('mouseleave', function () {
+ return config.onmouseout.call($$);
+ });
- ChartInternal.prototype.parseDate = function (date) {
- var $$ = this,
- parsedDate;
- if (date instanceof Date) {
- parsedDate = date;
- } else if (typeof date === 'string') {
- parsedDate = $$.dataTimeParse(date);
- } else if ((typeof date === 'undefined' ? 'undefined' : _typeof(date)) === 'object') {
- parsedDate = new Date(+date);
- } else if (typeof date === 'number' && !isNaN(date)) {
- parsedDate = new Date(+date);
- }
- if (!parsedDate || isNaN(+parsedDate)) {
- window.console.error("Failed to parse x '" + date + "' to Date object");
- }
- return parsedDate;
- };
+ if ($$.config.svg_classname) {
+ $$.svg.attr('class', $$.config.svg_classname);
+ } // Define defs
- ChartInternal.prototype.isTabVisible = function () {
- var hidden;
- if (typeof document.hidden !== "undefined") {
- // Opera 12.10 and Firefox 18 and later support
- hidden = "hidden";
- } else if (typeof document.mozHidden !== "undefined") {
- hidden = "mozHidden";
- } else if (typeof document.msHidden !== "undefined") {
- hidden = "msHidden";
- } else if (typeof document.webkitHidden !== "undefined") {
- hidden = "webkitHidden";
- }
- return document[hidden] ? false : true;
- };
+ defs = $$.svg.append("defs");
+ $$.clipChart = $$.appendClip(defs, $$.clipId);
+ $$.clipXAxis = $$.appendClip(defs, $$.clipIdForXAxis);
+ $$.clipYAxis = $$.appendClip(defs, $$.clipIdForYAxis);
+ $$.clipGrid = $$.appendClip(defs, $$.clipIdForGrid);
+ $$.clipSubchart = $$.appendClip(defs, $$.clipIdForSubchart);
+ $$.updateSvgSize(); // Define regions
- ChartInternal.prototype.getPathBox = getPathBox;
- ChartInternal.prototype.CLASS = CLASS;
+ main = $$.main = $$.svg.append("g").attr("transform", $$.getTranslate('main'));
- /* jshint ignore:start */
+ if ($$.initPie) {
+ $$.initPie();
+ }
- // PhantomJS doesn't have support for Function.prototype.bind, which has caused confusion. Use
- // this polyfill to avoid the confusion.
- // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind#Polyfill
+ if ($$.initDragZoom) {
+ $$.initDragZoom();
+ }
- if (!Function.prototype.bind) {
- Function.prototype.bind = function (oThis) {
- if (typeof this !== 'function') {
- // closest thing possible to the ECMAScript 5
- // internal IsCallable function
- throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable');
- }
+ if ($$.initSubchart) {
+ $$.initSubchart();
+ }
- var aArgs = Array.prototype.slice.call(arguments, 1),
- fToBind = this,
- fNOP = function fNOP() {},
- fBound = function fBound() {
- return fToBind.apply(this instanceof fNOP ? this : oThis, aArgs.concat(Array.prototype.slice.call(arguments)));
- };
+ if ($$.initTooltip) {
+ $$.initTooltip();
+ }
- fNOP.prototype = this.prototype;
- fBound.prototype = new fNOP();
+ if ($$.initLegend) {
+ $$.initLegend();
+ }
- return fBound;
- };
+ if ($$.initTitle) {
+ $$.initTitle();
}
- // SVGPathSeg API polyfill
- // https://github.com/progers/pathseg
- //
- // This is a drop-in replacement for the SVGPathSeg and SVGPathSegList APIs that were removed from
- // SVG2 (https://lists.w3.org/Archives/Public/www-svg/2015Jun/0044.html), including the latest spec
- // changes which were implemented in Firefox 43 and Chrome 46.
-
- (function () {
-
- if (!("SVGPathSeg" in window)) {
- // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGPathSeg
- window.SVGPathSeg = function (type, typeAsLetter, owningPathSegList) {
- this.pathSegType = type;
- this.pathSegTypeAsLetter = typeAsLetter;
- this._owningPathSegList = owningPathSegList;
- };
-
- window.SVGPathSeg.prototype.classname = "SVGPathSeg";
-
- window.SVGPathSeg.PATHSEG_UNKNOWN = 0;
- window.SVGPathSeg.PATHSEG_CLOSEPATH = 1;
- window.SVGPathSeg.PATHSEG_MOVETO_ABS = 2;
- window.SVGPathSeg.PATHSEG_MOVETO_REL = 3;
- window.SVGPathSeg.PATHSEG_LINETO_ABS = 4;
- window.SVGPathSeg.PATHSEG_LINETO_REL = 5;
- window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS = 6;
- window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL = 7;
- window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS = 8;
- window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL = 9;
- window.SVGPathSeg.PATHSEG_ARC_ABS = 10;
- window.SVGPathSeg.PATHSEG_ARC_REL = 11;
- window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS = 12;
- window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL = 13;
- window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS = 14;
- window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL = 15;
- window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS = 16;
- window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL = 17;
- window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS = 18;
- window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL = 19;
-
- // Notify owning PathSegList on any changes so they can be synchronized back to the path element.
- window.SVGPathSeg.prototype._segmentChanged = function () {
- if (this._owningPathSegList) this._owningPathSegList.segmentChanged(this);
- };
-
- window.SVGPathSegClosePath = function (owningPathSegList) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CLOSEPATH, "z", owningPathSegList);
- };
- window.SVGPathSegClosePath.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegClosePath.prototype.toString = function () {
- return "[object SVGPathSegClosePath]";
- };
- window.SVGPathSegClosePath.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter;
- };
- window.SVGPathSegClosePath.prototype.clone = function () {
- return new window.SVGPathSegClosePath(undefined);
- };
-
- window.SVGPathSegMovetoAbs = function (owningPathSegList, x, y) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_MOVETO_ABS, "M", owningPathSegList);
- this._x = x;
- this._y = y;
- };
- window.SVGPathSegMovetoAbs.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegMovetoAbs.prototype.toString = function () {
- return "[object SVGPathSegMovetoAbs]";
- };
- window.SVGPathSegMovetoAbs.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x + " " + this._y;
- };
- window.SVGPathSegMovetoAbs.prototype.clone = function () {
- return new window.SVGPathSegMovetoAbs(undefined, this._x, this._y);
- };
- Object.defineProperty(window.SVGPathSegMovetoAbs.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegMovetoAbs.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
+ if ($$.initZoom) {
+ $$.initZoom();
+ } // Update selection based on size and scale
+ // TODO: currently this must be called after initLegend because of update of sizes, but it should be done in initSubchart.
- window.SVGPathSegMovetoRel = function (owningPathSegList, x, y) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_MOVETO_REL, "m", owningPathSegList);
- this._x = x;
- this._y = y;
- };
- window.SVGPathSegMovetoRel.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegMovetoRel.prototype.toString = function () {
- return "[object SVGPathSegMovetoRel]";
- };
- window.SVGPathSegMovetoRel.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x + " " + this._y;
- };
- window.SVGPathSegMovetoRel.prototype.clone = function () {
- return new window.SVGPathSegMovetoRel(undefined, this._x, this._y);
- };
- Object.defineProperty(window.SVGPathSegMovetoRel.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegMovetoRel.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- window.SVGPathSegLinetoAbs = function (owningPathSegList, x, y) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_ABS, "L", owningPathSegList);
- this._x = x;
- this._y = y;
- };
- window.SVGPathSegLinetoAbs.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegLinetoAbs.prototype.toString = function () {
- return "[object SVGPathSegLinetoAbs]";
- };
- window.SVGPathSegLinetoAbs.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x + " " + this._y;
- };
- window.SVGPathSegLinetoAbs.prototype.clone = function () {
- return new window.SVGPathSegLinetoAbs(undefined, this._x, this._y);
- };
- Object.defineProperty(window.SVGPathSegLinetoAbs.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegLinetoAbs.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
+ if ($$.initSubchartBrush) {
+ $$.initSubchartBrush();
+ }
+ /*-- Main Region --*/
+ // text when empty
- window.SVGPathSegLinetoRel = function (owningPathSegList, x, y) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_REL, "l", owningPathSegList);
- this._x = x;
- this._y = y;
- };
- window.SVGPathSegLinetoRel.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegLinetoRel.prototype.toString = function () {
- return "[object SVGPathSegLinetoRel]";
- };
- window.SVGPathSegLinetoRel.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x + " " + this._y;
- };
- window.SVGPathSegLinetoRel.prototype.clone = function () {
- return new window.SVGPathSegLinetoRel(undefined, this._x, this._y);
- };
- Object.defineProperty(window.SVGPathSegLinetoRel.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegLinetoRel.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- window.SVGPathSegCurvetoCubicAbs = function (owningPathSegList, x, y, x1, y1, x2, y2) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS, "C", owningPathSegList);
- this._x = x;
- this._y = y;
- this._x1 = x1;
- this._y1 = y1;
- this._x2 = x2;
- this._y2 = y2;
- };
- window.SVGPathSegCurvetoCubicAbs.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegCurvetoCubicAbs.prototype.toString = function () {
- return "[object SVGPathSegCurvetoCubicAbs]";
- };
- window.SVGPathSegCurvetoCubicAbs.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x1 + " " + this._y1 + " " + this._x2 + " " + this._y2 + " " + this._x + " " + this._y;
- };
- window.SVGPathSegCurvetoCubicAbs.prototype.clone = function () {
- return new window.SVGPathSegCurvetoCubicAbs(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2);
- };
- Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "x1", {
- get: function get() {
- return this._x1;
- },
- set: function set(x1) {
- this._x1 = x1;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "y1", {
- get: function get() {
- return this._y1;
- },
- set: function set(y1) {
- this._y1 = y1;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "x2", {
- get: function get() {
- return this._x2;
- },
- set: function set(x2) {
- this._x2 = x2;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "y2", {
- get: function get() {
- return this._y2;
- },
- set: function set(y2) {
- this._y2 = y2;
- this._segmentChanged();
- },
- enumerable: true
- });
+ main.append("text").attr("class", CLASS.text + ' ' + CLASS.empty).attr("text-anchor", "middle") // horizontal centering of text at x position in all browsers.
+ .attr("dominant-baseline", "middle"); // vertical centering of text at y position in all browsers, except IE.
+ // Regions
- window.SVGPathSegCurvetoCubicRel = function (owningPathSegList, x, y, x1, y1, x2, y2) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL, "c", owningPathSegList);
- this._x = x;
- this._y = y;
- this._x1 = x1;
- this._y1 = y1;
- this._x2 = x2;
- this._y2 = y2;
- };
- window.SVGPathSegCurvetoCubicRel.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegCurvetoCubicRel.prototype.toString = function () {
- return "[object SVGPathSegCurvetoCubicRel]";
- };
- window.SVGPathSegCurvetoCubicRel.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x1 + " " + this._y1 + " " + this._x2 + " " + this._y2 + " " + this._x + " " + this._y;
- };
- window.SVGPathSegCurvetoCubicRel.prototype.clone = function () {
- return new window.SVGPathSegCurvetoCubicRel(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2);
- };
- Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "x1", {
- get: function get() {
- return this._x1;
- },
- set: function set(x1) {
- this._x1 = x1;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "y1", {
- get: function get() {
- return this._y1;
- },
- set: function set(y1) {
- this._y1 = y1;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "x2", {
- get: function get() {
- return this._x2;
- },
- set: function set(x2) {
- this._x2 = x2;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "y2", {
- get: function get() {
- return this._y2;
- },
- set: function set(y2) {
- this._y2 = y2;
- this._segmentChanged();
- },
- enumerable: true
- });
+ $$.initRegion(); // Grids
- window.SVGPathSegCurvetoQuadraticAbs = function (owningPathSegList, x, y, x1, y1) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS, "Q", owningPathSegList);
- this._x = x;
- this._y = y;
- this._x1 = x1;
- this._y1 = y1;
- };
- window.SVGPathSegCurvetoQuadraticAbs.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegCurvetoQuadraticAbs.prototype.toString = function () {
- return "[object SVGPathSegCurvetoQuadraticAbs]";
- };
- window.SVGPathSegCurvetoQuadraticAbs.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x1 + " " + this._y1 + " " + this._x + " " + this._y;
- };
- window.SVGPathSegCurvetoQuadraticAbs.prototype.clone = function () {
- return new window.SVGPathSegCurvetoQuadraticAbs(undefined, this._x, this._y, this._x1, this._y1);
- };
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, "x1", {
- get: function get() {
- return this._x1;
- },
- set: function set(x1) {
- this._x1 = x1;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, "y1", {
- get: function get() {
- return this._y1;
- },
- set: function set(y1) {
- this._y1 = y1;
- this._segmentChanged();
- },
- enumerable: true
- });
+ $$.initGrid(); // Define g for chart area
- window.SVGPathSegCurvetoQuadraticRel = function (owningPathSegList, x, y, x1, y1) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL, "q", owningPathSegList);
- this._x = x;
- this._y = y;
- this._x1 = x1;
- this._y1 = y1;
- };
- window.SVGPathSegCurvetoQuadraticRel.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegCurvetoQuadraticRel.prototype.toString = function () {
- return "[object SVGPathSegCurvetoQuadraticRel]";
- };
- window.SVGPathSegCurvetoQuadraticRel.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x1 + " " + this._y1 + " " + this._x + " " + this._y;
- };
- window.SVGPathSegCurvetoQuadraticRel.prototype.clone = function () {
- return new window.SVGPathSegCurvetoQuadraticRel(undefined, this._x, this._y, this._x1, this._y1);
- };
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, "x1", {
- get: function get() {
- return this._x1;
- },
- set: function set(x1) {
- this._x1 = x1;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, "y1", {
- get: function get() {
- return this._y1;
- },
- set: function set(y1) {
- this._y1 = y1;
- this._segmentChanged();
- },
- enumerable: true
- });
+ main.append('g').attr("clip-path", $$.clipPath).attr('class', CLASS.chart); // Grid lines
- window.SVGPathSegArcAbs = function (owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_ARC_ABS, "A", owningPathSegList);
- this._x = x;
- this._y = y;
- this._r1 = r1;
- this._r2 = r2;
- this._angle = angle;
- this._largeArcFlag = largeArcFlag;
- this._sweepFlag = sweepFlag;
- };
- window.SVGPathSegArcAbs.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegArcAbs.prototype.toString = function () {
- return "[object SVGPathSegArcAbs]";
- };
- window.SVGPathSegArcAbs.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._r1 + " " + this._r2 + " " + this._angle + " " + (this._largeArcFlag ? "1" : "0") + " " + (this._sweepFlag ? "1" : "0") + " " + this._x + " " + this._y;
- };
- window.SVGPathSegArcAbs.prototype.clone = function () {
- return new window.SVGPathSegArcAbs(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag);
- };
- Object.defineProperty(window.SVGPathSegArcAbs.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcAbs.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcAbs.prototype, "r1", {
- get: function get() {
- return this._r1;
- },
- set: function set(r1) {
- this._r1 = r1;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcAbs.prototype, "r2", {
- get: function get() {
- return this._r2;
- },
- set: function set(r2) {
- this._r2 = r2;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcAbs.prototype, "angle", {
- get: function get() {
- return this._angle;
- },
- set: function set(angle) {
- this._angle = angle;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcAbs.prototype, "largeArcFlag", {
- get: function get() {
- return this._largeArcFlag;
- },
- set: function set(largeArcFlag) {
- this._largeArcFlag = largeArcFlag;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcAbs.prototype, "sweepFlag", {
- get: function get() {
- return this._sweepFlag;
- },
- set: function set(sweepFlag) {
- this._sweepFlag = sweepFlag;
- this._segmentChanged();
- },
- enumerable: true
- });
+ if (config.grid_lines_front) {
+ $$.initGridLines();
+ } // Cover whole with rects for events
- window.SVGPathSegArcRel = function (owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_ARC_REL, "a", owningPathSegList);
- this._x = x;
- this._y = y;
- this._r1 = r1;
- this._r2 = r2;
- this._angle = angle;
- this._largeArcFlag = largeArcFlag;
- this._sweepFlag = sweepFlag;
- };
- window.SVGPathSegArcRel.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegArcRel.prototype.toString = function () {
- return "[object SVGPathSegArcRel]";
- };
- window.SVGPathSegArcRel.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._r1 + " " + this._r2 + " " + this._angle + " " + (this._largeArcFlag ? "1" : "0") + " " + (this._sweepFlag ? "1" : "0") + " " + this._x + " " + this._y;
- };
- window.SVGPathSegArcRel.prototype.clone = function () {
- return new window.SVGPathSegArcRel(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag);
- };
- Object.defineProperty(window.SVGPathSegArcRel.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcRel.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcRel.prototype, "r1", {
- get: function get() {
- return this._r1;
- },
- set: function set(r1) {
- this._r1 = r1;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcRel.prototype, "r2", {
- get: function get() {
- return this._r2;
- },
- set: function set(r2) {
- this._r2 = r2;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcRel.prototype, "angle", {
- get: function get() {
- return this._angle;
- },
- set: function set(angle) {
- this._angle = angle;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcRel.prototype, "largeArcFlag", {
- get: function get() {
- return this._largeArcFlag;
- },
- set: function set(largeArcFlag) {
- this._largeArcFlag = largeArcFlag;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegArcRel.prototype, "sweepFlag", {
- get: function get() {
- return this._sweepFlag;
- },
- set: function set(sweepFlag) {
- this._sweepFlag = sweepFlag;
- this._segmentChanged();
- },
- enumerable: true
- });
- window.SVGPathSegLinetoHorizontalAbs = function (owningPathSegList, x) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS, "H", owningPathSegList);
- this._x = x;
- };
- window.SVGPathSegLinetoHorizontalAbs.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegLinetoHorizontalAbs.prototype.toString = function () {
- return "[object SVGPathSegLinetoHorizontalAbs]";
- };
- window.SVGPathSegLinetoHorizontalAbs.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x;
- };
- window.SVGPathSegLinetoHorizontalAbs.prototype.clone = function () {
- return new window.SVGPathSegLinetoHorizontalAbs(undefined, this._x);
- };
- Object.defineProperty(window.SVGPathSegLinetoHorizontalAbs.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
+ $$.initEventRect(); // Define g for chart
- window.SVGPathSegLinetoHorizontalRel = function (owningPathSegList, x) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL, "h", owningPathSegList);
- this._x = x;
- };
- window.SVGPathSegLinetoHorizontalRel.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegLinetoHorizontalRel.prototype.toString = function () {
- return "[object SVGPathSegLinetoHorizontalRel]";
- };
- window.SVGPathSegLinetoHorizontalRel.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x;
- };
- window.SVGPathSegLinetoHorizontalRel.prototype.clone = function () {
- return new window.SVGPathSegLinetoHorizontalRel(undefined, this._x);
- };
- Object.defineProperty(window.SVGPathSegLinetoHorizontalRel.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
+ $$.initChartElements(); // Add Axis
- window.SVGPathSegLinetoVerticalAbs = function (owningPathSegList, y) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS, "V", owningPathSegList);
- this._y = y;
- };
- window.SVGPathSegLinetoVerticalAbs.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegLinetoVerticalAbs.prototype.toString = function () {
- return "[object SVGPathSegLinetoVerticalAbs]";
- };
- window.SVGPathSegLinetoVerticalAbs.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._y;
- };
- window.SVGPathSegLinetoVerticalAbs.prototype.clone = function () {
- return new window.SVGPathSegLinetoVerticalAbs(undefined, this._y);
- };
- Object.defineProperty(window.SVGPathSegLinetoVerticalAbs.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
+ $$.axis.init(); // Set targets
- window.SVGPathSegLinetoVerticalRel = function (owningPathSegList, y) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL, "v", owningPathSegList);
- this._y = y;
- };
- window.SVGPathSegLinetoVerticalRel.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegLinetoVerticalRel.prototype.toString = function () {
- return "[object SVGPathSegLinetoVerticalRel]";
- };
- window.SVGPathSegLinetoVerticalRel.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._y;
- };
- window.SVGPathSegLinetoVerticalRel.prototype.clone = function () {
- return new window.SVGPathSegLinetoVerticalRel(undefined, this._y);
- };
- Object.defineProperty(window.SVGPathSegLinetoVerticalRel.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
+ $$.updateTargets($$.data.targets); // Set default extent if defined
- window.SVGPathSegCurvetoCubicSmoothAbs = function (owningPathSegList, x, y, x2, y2) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS, "S", owningPathSegList);
- this._x = x;
- this._y = y;
- this._x2 = x2;
- this._y2 = y2;
- };
- window.SVGPathSegCurvetoCubicSmoothAbs.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegCurvetoCubicSmoothAbs.prototype.toString = function () {
- return "[object SVGPathSegCurvetoCubicSmoothAbs]";
- };
- window.SVGPathSegCurvetoCubicSmoothAbs.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x2 + " " + this._y2 + " " + this._x + " " + this._y;
- };
- window.SVGPathSegCurvetoCubicSmoothAbs.prototype.clone = function () {
- return new window.SVGPathSegCurvetoCubicSmoothAbs(undefined, this._x, this._y, this._x2, this._y2);
- };
- Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, "x2", {
- get: function get() {
- return this._x2;
- },
- set: function set(x2) {
- this._x2 = x2;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, "y2", {
- get: function get() {
- return this._y2;
- },
- set: function set(y2) {
- this._y2 = y2;
- this._segmentChanged();
- },
- enumerable: true
- });
+ if (config.axis_x_selection) {
+ $$.brush.selectionAsValue($$.getDefaultSelection());
+ } // Draw with targets
- window.SVGPathSegCurvetoCubicSmoothRel = function (owningPathSegList, x, y, x2, y2) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL, "s", owningPathSegList);
- this._x = x;
- this._y = y;
- this._x2 = x2;
- this._y2 = y2;
- };
- window.SVGPathSegCurvetoCubicSmoothRel.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegCurvetoCubicSmoothRel.prototype.toString = function () {
- return "[object SVGPathSegCurvetoCubicSmoothRel]";
- };
- window.SVGPathSegCurvetoCubicSmoothRel.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x2 + " " + this._y2 + " " + this._x + " " + this._y;
- };
- window.SVGPathSegCurvetoCubicSmoothRel.prototype.clone = function () {
- return new window.SVGPathSegCurvetoCubicSmoothRel(undefined, this._x, this._y, this._x2, this._y2);
- };
- Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, "x2", {
- get: function get() {
- return this._x2;
- },
- set: function set(x2) {
- this._x2 = x2;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, "y2", {
- get: function get() {
- return this._y2;
- },
- set: function set(y2) {
- this._y2 = y2;
- this._segmentChanged();
- },
- enumerable: true
- });
- window.SVGPathSegCurvetoQuadraticSmoothAbs = function (owningPathSegList, x, y) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS, "T", owningPathSegList);
- this._x = x;
- this._y = y;
- };
- window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype.toString = function () {
- return "[object SVGPathSegCurvetoQuadraticSmoothAbs]";
- };
- window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x + " " + this._y;
- };
- window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype.clone = function () {
- return new window.SVGPathSegCurvetoQuadraticSmoothAbs(undefined, this._x, this._y);
- };
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothAbs.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
+ if (binding) {
+ $$.updateDimension();
+ $$.config.oninit.call($$);
+ $$.redraw({
+ withTransition: false,
+ withTransform: true,
+ withUpdateXDomain: true,
+ withUpdateOrgXDomain: true,
+ withTransitionForAxis: false
+ });
+ } // Bind to resize event
- window.SVGPathSegCurvetoQuadraticSmoothRel = function (owningPathSegList, x, y) {
- window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL, "t", owningPathSegList);
- this._x = x;
- this._y = y;
- };
- window.SVGPathSegCurvetoQuadraticSmoothRel.prototype = Object.create(window.SVGPathSeg.prototype);
- window.SVGPathSegCurvetoQuadraticSmoothRel.prototype.toString = function () {
- return "[object SVGPathSegCurvetoQuadraticSmoothRel]";
- };
- window.SVGPathSegCurvetoQuadraticSmoothRel.prototype._asPathString = function () {
- return this.pathSegTypeAsLetter + " " + this._x + " " + this._y;
- };
- window.SVGPathSegCurvetoQuadraticSmoothRel.prototype.clone = function () {
- return new window.SVGPathSegCurvetoQuadraticSmoothRel(undefined, this._x, this._y);
- };
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothRel.prototype, "x", {
- get: function get() {
- return this._x;
- },
- set: function set(x) {
- this._x = x;
- this._segmentChanged();
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathSegCurvetoQuadraticSmoothRel.prototype, "y", {
- get: function get() {
- return this._y;
- },
- set: function set(y) {
- this._y = y;
- this._segmentChanged();
- },
- enumerable: true
- });
- // Add createSVGPathSeg* functions to window.SVGPathElement.
- // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-Interfacewindow.SVGPathElement.
- window.SVGPathElement.prototype.createSVGPathSegClosePath = function () {
- return new window.SVGPathSegClosePath(undefined);
- };
- window.SVGPathElement.prototype.createSVGPathSegMovetoAbs = function (x, y) {
- return new window.SVGPathSegMovetoAbs(undefined, x, y);
- };
- window.SVGPathElement.prototype.createSVGPathSegMovetoRel = function (x, y) {
- return new window.SVGPathSegMovetoRel(undefined, x, y);
- };
- window.SVGPathElement.prototype.createSVGPathSegLinetoAbs = function (x, y) {
- return new window.SVGPathSegLinetoAbs(undefined, x, y);
- };
- window.SVGPathElement.prototype.createSVGPathSegLinetoRel = function (x, y) {
- return new window.SVGPathSegLinetoRel(undefined, x, y);
- };
- window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicAbs = function (x, y, x1, y1, x2, y2) {
- return new window.SVGPathSegCurvetoCubicAbs(undefined, x, y, x1, y1, x2, y2);
- };
- window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicRel = function (x, y, x1, y1, x2, y2) {
- return new window.SVGPathSegCurvetoCubicRel(undefined, x, y, x1, y1, x2, y2);
- };
- window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticAbs = function (x, y, x1, y1) {
- return new window.SVGPathSegCurvetoQuadraticAbs(undefined, x, y, x1, y1);
- };
- window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticRel = function (x, y, x1, y1) {
- return new window.SVGPathSegCurvetoQuadraticRel(undefined, x, y, x1, y1);
- };
- window.SVGPathElement.prototype.createSVGPathSegArcAbs = function (x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
- return new window.SVGPathSegArcAbs(undefined, x, y, r1, r2, angle, largeArcFlag, sweepFlag);
- };
- window.SVGPathElement.prototype.createSVGPathSegArcRel = function (x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
- return new window.SVGPathSegArcRel(undefined, x, y, r1, r2, angle, largeArcFlag, sweepFlag);
- };
- window.SVGPathElement.prototype.createSVGPathSegLinetoHorizontalAbs = function (x) {
- return new window.SVGPathSegLinetoHorizontalAbs(undefined, x);
- };
- window.SVGPathElement.prototype.createSVGPathSegLinetoHorizontalRel = function (x) {
- return new window.SVGPathSegLinetoHorizontalRel(undefined, x);
- };
- window.SVGPathElement.prototype.createSVGPathSegLinetoVerticalAbs = function (y) {
- return new window.SVGPathSegLinetoVerticalAbs(undefined, y);
- };
- window.SVGPathElement.prototype.createSVGPathSegLinetoVerticalRel = function (y) {
- return new window.SVGPathSegLinetoVerticalRel(undefined, y);
- };
- window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicSmoothAbs = function (x, y, x2, y2) {
- return new window.SVGPathSegCurvetoCubicSmoothAbs(undefined, x, y, x2, y2);
- };
- window.SVGPathElement.prototype.createSVGPathSegCurvetoCubicSmoothRel = function (x, y, x2, y2) {
- return new window.SVGPathSegCurvetoCubicSmoothRel(undefined, x, y, x2, y2);
- };
- window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticSmoothAbs = function (x, y) {
- return new window.SVGPathSegCurvetoQuadraticSmoothAbs(undefined, x, y);
- };
- window.SVGPathElement.prototype.createSVGPathSegCurvetoQuadraticSmoothRel = function (x, y) {
- return new window.SVGPathSegCurvetoQuadraticSmoothRel(undefined, x, y);
- };
-
- if (!("getPathSegAtLength" in window.SVGPathElement.prototype)) {
- // Add getPathSegAtLength to SVGPathElement.
- // Spec: https://www.w3.org/TR/SVG11/single-page.html#paths-__svg__SVGPathElement__getPathSegAtLength
- // This polyfill requires SVGPathElement.getTotalLength to implement the distance-along-a-path algorithm.
- window.SVGPathElement.prototype.getPathSegAtLength = function (distance) {
- if (distance === undefined || !isFinite(distance)) throw "Invalid arguments.";
-
- var measurementElement = document.createElementNS("http://www.w3.org/2000/svg", "path");
- measurementElement.setAttribute("d", this.getAttribute("d"));
- var lastPathSegment = measurementElement.pathSegList.numberOfItems - 1;
-
- // If the path is empty, return 0.
- if (lastPathSegment <= 0) return 0;
-
- do {
- measurementElement.pathSegList.removeItem(lastPathSegment);
- if (distance > measurementElement.getTotalLength()) break;
- lastPathSegment--;
- } while (lastPathSegment > 0);
- return lastPathSegment;
- };
- }
- }
+ $$.bindResize(); // Bind to window focus event
- if (!("SVGPathSegList" in window)) {
- // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGPathSegList
- window.SVGPathSegList = function (pathElement) {
- this._pathElement = pathElement;
- this._list = this._parsePath(this._pathElement.getAttribute("d"));
-
- // Use a MutationObserver to catch changes to the path's "d" attribute.
- this._mutationObserverConfig = {
- "attributes": true,
- "attributeFilter": ["d"]
- };
- this._pathElementMutationObserver = new MutationObserver(this._updateListFromPathMutations.bind(this));
- this._pathElementMutationObserver.observe(this._pathElement, this._mutationObserverConfig);
- };
-
- window.SVGPathSegList.prototype.classname = "SVGPathSegList";
-
- Object.defineProperty(window.SVGPathSegList.prototype, "numberOfItems", {
- get: function get() {
- this._checkPathSynchronizedToList();
- return this._list.length;
- },
- enumerable: true
- });
+ $$.bindWindowFocus(); // export element of the chart
- // Add the pathSegList accessors to window.SVGPathElement.
- // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGAnimatedPathData
- Object.defineProperty(window.SVGPathElement.prototype, "pathSegList", {
- get: function get() {
- if (!this._pathSegList) this._pathSegList = new window.SVGPathSegList(this);
- return this._pathSegList;
- },
- enumerable: true
- });
- // FIXME: The following are not implemented and simply return window.SVGPathElement.pathSegList.
- Object.defineProperty(window.SVGPathElement.prototype, "normalizedPathSegList", {
- get: function get() {
- return this.pathSegList;
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathElement.prototype, "animatedPathSegList", {
- get: function get() {
- return this.pathSegList;
- },
- enumerable: true
- });
- Object.defineProperty(window.SVGPathElement.prototype, "animatedNormalizedPathSegList", {
- get: function get() {
- return this.pathSegList;
- },
- enumerable: true
- });
+ $$.api.element = $$.selectChart.node();
+ };
- // Process any pending mutations to the path element and update the list as needed.
- // This should be the first call of all public functions and is needed because
- // MutationObservers are not synchronous so we can have pending asynchronous mutations.
- window.SVGPathSegList.prototype._checkPathSynchronizedToList = function () {
- this._updateListFromPathMutations(this._pathElementMutationObserver.takeRecords());
- };
-
- window.SVGPathSegList.prototype._updateListFromPathMutations = function (mutationRecords) {
- if (!this._pathElement) return;
- var hasPathMutations = false;
- mutationRecords.forEach(function (record) {
- if (record.attributeName == "d") hasPathMutations = true;
- });
- if (hasPathMutations) this._list = this._parsePath(this._pathElement.getAttribute("d"));
- };
-
- // Serialize the list and update the path's 'd' attribute.
- window.SVGPathSegList.prototype._writeListToPath = function () {
- this._pathElementMutationObserver.disconnect();
- this._pathElement.setAttribute("d", window.SVGPathSegList._pathSegArrayAsString(this._list));
- this._pathElementMutationObserver.observe(this._pathElement, this._mutationObserverConfig);
- };
-
- // When a path segment changes the list needs to be synchronized back to the path element.
- window.SVGPathSegList.prototype.segmentChanged = function (pathSeg) {
- this._writeListToPath();
- };
-
- window.SVGPathSegList.prototype.clear = function () {
- this._checkPathSynchronizedToList();
-
- this._list.forEach(function (pathSeg) {
- pathSeg._owningPathSegList = null;
- });
- this._list = [];
- this._writeListToPath();
- };
-
- window.SVGPathSegList.prototype.initialize = function (newItem) {
- this._checkPathSynchronizedToList();
-
- this._list = [newItem];
- newItem._owningPathSegList = this;
- this._writeListToPath();
- return newItem;
- };
-
- window.SVGPathSegList.prototype._checkValidIndex = function (index) {
- if (isNaN(index) || index < 0 || index >= this.numberOfItems) throw "INDEX_SIZE_ERR";
- };
-
- window.SVGPathSegList.prototype.getItem = function (index) {
- this._checkPathSynchronizedToList();
-
- this._checkValidIndex(index);
- return this._list[index];
- };
-
- window.SVGPathSegList.prototype.insertItemBefore = function (newItem, index) {
- this._checkPathSynchronizedToList();
-
- // Spec: If the index is greater than or equal to numberOfItems, then the new item is appended to the end of the list.
- if (index > this.numberOfItems) index = this.numberOfItems;
- if (newItem._owningPathSegList) {
- // SVG2 spec says to make a copy.
- newItem = newItem.clone();
- }
- this._list.splice(index, 0, newItem);
- newItem._owningPathSegList = this;
- this._writeListToPath();
- return newItem;
- };
-
- window.SVGPathSegList.prototype.replaceItem = function (newItem, index) {
- this._checkPathSynchronizedToList();
-
- if (newItem._owningPathSegList) {
- // SVG2 spec says to make a copy.
- newItem = newItem.clone();
- }
- this._checkValidIndex(index);
- this._list[index] = newItem;
- newItem._owningPathSegList = this;
- this._writeListToPath();
- return newItem;
- };
-
- window.SVGPathSegList.prototype.removeItem = function (index) {
- this._checkPathSynchronizedToList();
-
- this._checkValidIndex(index);
- var item = this._list[index];
- this._list.splice(index, 1);
- this._writeListToPath();
- return item;
- };
-
- window.SVGPathSegList.prototype.appendItem = function (newItem) {
- this._checkPathSynchronizedToList();
-
- if (newItem._owningPathSegList) {
- // SVG2 spec says to make a copy.
- newItem = newItem.clone();
- }
- this._list.push(newItem);
- newItem._owningPathSegList = this;
- // TODO: Optimize this to just append to the existing attribute.
- this._writeListToPath();
- return newItem;
- };
-
- window.SVGPathSegList._pathSegArrayAsString = function (pathSegArray) {
- var string = "";
- var first = true;
- pathSegArray.forEach(function (pathSeg) {
- if (first) {
- first = false;
- string += pathSeg._asPathString();
- } else {
- string += " " + pathSeg._asPathString();
- }
- });
- return string;
- };
-
- // This closely follows SVGPathParser::parsePath from Source/core/svg/SVGPathParser.cpp.
- window.SVGPathSegList.prototype._parsePath = function (string) {
- if (!string || string.length == 0) return [];
-
- var owningPathSegList = this;
-
- var Builder = function Builder() {
- this.pathSegList = [];
- };
-
- Builder.prototype.appendSegment = function (pathSeg) {
- this.pathSegList.push(pathSeg);
- };
-
- var Source = function Source(string) {
- this._string = string;
- this._currentIndex = 0;
- this._endIndex = this._string.length;
- this._previousCommand = window.SVGPathSeg.PATHSEG_UNKNOWN;
-
- this._skipOptionalSpaces();
- };
-
- Source.prototype._isCurrentSpace = function () {
- var character = this._string[this._currentIndex];
- return character <= " " && (character == " " || character == "\n" || character == "\t" || character == "\r" || character == "\f");
- };
-
- Source.prototype._skipOptionalSpaces = function () {
- while (this._currentIndex < this._endIndex && this._isCurrentSpace()) {
- this._currentIndex++;
- }return this._currentIndex < this._endIndex;
- };
-
- Source.prototype._skipOptionalSpacesOrDelimiter = function () {
- if (this._currentIndex < this._endIndex && !this._isCurrentSpace() && this._string.charAt(this._currentIndex) != ",") return false;
- if (this._skipOptionalSpaces()) {
- if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) == ",") {
- this._currentIndex++;
- this._skipOptionalSpaces();
- }
- }
- return this._currentIndex < this._endIndex;
- };
-
- Source.prototype.hasMoreData = function () {
- return this._currentIndex < this._endIndex;
- };
-
- Source.prototype.peekSegmentType = function () {
- var lookahead = this._string[this._currentIndex];
- return this._pathSegTypeFromChar(lookahead);
- };
-
- Source.prototype._pathSegTypeFromChar = function (lookahead) {
- switch (lookahead) {
- case "Z":
- case "z":
- return window.SVGPathSeg.PATHSEG_CLOSEPATH;
- case "M":
- return window.SVGPathSeg.PATHSEG_MOVETO_ABS;
- case "m":
- return window.SVGPathSeg.PATHSEG_MOVETO_REL;
- case "L":
- return window.SVGPathSeg.PATHSEG_LINETO_ABS;
- case "l":
- return window.SVGPathSeg.PATHSEG_LINETO_REL;
- case "C":
- return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS;
- case "c":
- return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL;
- case "Q":
- return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS;
- case "q":
- return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL;
- case "A":
- return window.SVGPathSeg.PATHSEG_ARC_ABS;
- case "a":
- return window.SVGPathSeg.PATHSEG_ARC_REL;
- case "H":
- return window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS;
- case "h":
- return window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL;
- case "V":
- return window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS;
- case "v":
- return window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL;
- case "S":
- return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS;
- case "s":
- return window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL;
- case "T":
- return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS;
- case "t":
- return window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL;
- default:
- return window.SVGPathSeg.PATHSEG_UNKNOWN;
- }
- };
-
- Source.prototype._nextCommandHelper = function (lookahead, previousCommand) {
- // Check for remaining coordinates in the current command.
- if ((lookahead == "+" || lookahead == "-" || lookahead == "." || lookahead >= "0" && lookahead <= "9") && previousCommand != window.SVGPathSeg.PATHSEG_CLOSEPATH) {
- if (previousCommand == window.SVGPathSeg.PATHSEG_MOVETO_ABS) return window.SVGPathSeg.PATHSEG_LINETO_ABS;
- if (previousCommand == window.SVGPathSeg.PATHSEG_MOVETO_REL) return window.SVGPathSeg.PATHSEG_LINETO_REL;
- return previousCommand;
- }
- return window.SVGPathSeg.PATHSEG_UNKNOWN;
- };
-
- Source.prototype.initialCommandIsMoveTo = function () {
- // If the path is empty it is still valid, so return true.
- if (!this.hasMoreData()) return true;
- var command = this.peekSegmentType();
- // Path must start with moveTo.
- return command == window.SVGPathSeg.PATHSEG_MOVETO_ABS || command == window.SVGPathSeg.PATHSEG_MOVETO_REL;
- };
-
- // Parse a number from an SVG path. This very closely follows genericParseNumber(...) from Source/core/svg/SVGParserUtilities.cpp.
- // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-PathDataBNF
- Source.prototype._parseNumber = function () {
- var exponent = 0;
- var integer = 0;
- var frac = 1;
- var decimal = 0;
- var sign = 1;
- var expsign = 1;
-
- var startIndex = this._currentIndex;
-
- this._skipOptionalSpaces();
-
- // Read the sign.
- if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) == "+") this._currentIndex++;else if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) == "-") {
- this._currentIndex++;
- sign = -1;
- }
-
- if (this._currentIndex == this._endIndex || (this._string.charAt(this._currentIndex) < "0" || this._string.charAt(this._currentIndex) > "9") && this._string.charAt(this._currentIndex) != ".")
- // The first character of a number must be one of [0-9+-.].
- return undefined;
-
- // Read the integer part, build right-to-left.
- var startIntPartIndex = this._currentIndex;
- while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= "0" && this._string.charAt(this._currentIndex) <= "9") {
- this._currentIndex++;
- } // Advance to first non-digit.
-
- if (this._currentIndex != startIntPartIndex) {
- var scanIntPartIndex = this._currentIndex - 1;
- var multiplier = 1;
- while (scanIntPartIndex >= startIntPartIndex) {
- integer += multiplier * (this._string.charAt(scanIntPartIndex--) - "0");
- multiplier *= 10;
- }
- }
-
- // Read the decimals.
- if (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) == ".") {
- this._currentIndex++;
-
- // There must be a least one digit following the .
- if (this._currentIndex >= this._endIndex || this._string.charAt(this._currentIndex) < "0" || this._string.charAt(this._currentIndex) > "9") return undefined;
- while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= "0" && this._string.charAt(this._currentIndex) <= "9") {
- frac *= 10;
- decimal += (this._string.charAt(this._currentIndex) - "0") / frac;
- this._currentIndex += 1;
- }
- }
-
- // Read the exponent part.
- if (this._currentIndex != startIndex && this._currentIndex + 1 < this._endIndex && (this._string.charAt(this._currentIndex) == "e" || this._string.charAt(this._currentIndex) == "E") && this._string.charAt(this._currentIndex + 1) != "x" && this._string.charAt(this._currentIndex + 1) != "m") {
- this._currentIndex++;
-
- // Read the sign of the exponent.
- if (this._string.charAt(this._currentIndex) == "+") {
- this._currentIndex++;
- } else if (this._string.charAt(this._currentIndex) == "-") {
- this._currentIndex++;
- expsign = -1;
- }
-
- // There must be an exponent.
- if (this._currentIndex >= this._endIndex || this._string.charAt(this._currentIndex) < "0" || this._string.charAt(this._currentIndex) > "9") return undefined;
-
- while (this._currentIndex < this._endIndex && this._string.charAt(this._currentIndex) >= "0" && this._string.charAt(this._currentIndex) <= "9") {
- exponent *= 10;
- exponent += this._string.charAt(this._currentIndex) - "0";
- this._currentIndex++;
- }
- }
-
- var number = integer + decimal;
- number *= sign;
-
- if (exponent) number *= Math.pow(10, expsign * exponent);
-
- if (startIndex == this._currentIndex) return undefined;
-
- this._skipOptionalSpacesOrDelimiter();
-
- return number;
- };
-
- Source.prototype._parseArcFlag = function () {
- if (this._currentIndex >= this._endIndex) return undefined;
- var flag = false;
- var flagChar = this._string.charAt(this._currentIndex++);
- if (flagChar == "0") flag = false;else if (flagChar == "1") flag = true;else return undefined;
-
- this._skipOptionalSpacesOrDelimiter();
- return flag;
- };
-
- Source.prototype.parseSegment = function () {
- var lookahead = this._string[this._currentIndex];
- var command = this._pathSegTypeFromChar(lookahead);
- if (command == window.SVGPathSeg.PATHSEG_UNKNOWN) {
- // Possibly an implicit command. Not allowed if this is the first command.
- if (this._previousCommand == window.SVGPathSeg.PATHSEG_UNKNOWN) return null;
- command = this._nextCommandHelper(lookahead, this._previousCommand);
- if (command == window.SVGPathSeg.PATHSEG_UNKNOWN) return null;
- } else {
- this._currentIndex++;
- }
-
- this._previousCommand = command;
-
- switch (command) {
- case window.SVGPathSeg.PATHSEG_MOVETO_REL:
- return new window.SVGPathSegMovetoRel(owningPathSegList, this._parseNumber(), this._parseNumber());
- case window.SVGPathSeg.PATHSEG_MOVETO_ABS:
- return new window.SVGPathSegMovetoAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
- case window.SVGPathSeg.PATHSEG_LINETO_REL:
- return new window.SVGPathSegLinetoRel(owningPathSegList, this._parseNumber(), this._parseNumber());
- case window.SVGPathSeg.PATHSEG_LINETO_ABS:
- return new window.SVGPathSegLinetoAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
- case window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL:
- return new window.SVGPathSegLinetoHorizontalRel(owningPathSegList, this._parseNumber());
- case window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS:
- return new window.SVGPathSegLinetoHorizontalAbs(owningPathSegList, this._parseNumber());
- case window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL:
- return new window.SVGPathSegLinetoVerticalRel(owningPathSegList, this._parseNumber());
- case window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS:
- return new window.SVGPathSegLinetoVerticalAbs(owningPathSegList, this._parseNumber());
- case window.SVGPathSeg.PATHSEG_CLOSEPATH:
- this._skipOptionalSpaces();
- return new window.SVGPathSegClosePath(owningPathSegList);
- case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL:
- var points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- x2: this._parseNumber(),
- y2: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new window.SVGPathSegCurvetoCubicRel(owningPathSegList, points.x, points.y, points.x1, points.y1, points.x2, points.y2);
- case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS:
- var points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- x2: this._parseNumber(),
- y2: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new window.SVGPathSegCurvetoCubicAbs(owningPathSegList, points.x, points.y, points.x1, points.y1, points.x2, points.y2);
- case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL:
- var points = {
- x2: this._parseNumber(),
- y2: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new window.SVGPathSegCurvetoCubicSmoothRel(owningPathSegList, points.x, points.y, points.x2, points.y2);
- case window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS:
- var points = {
- x2: this._parseNumber(),
- y2: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new window.SVGPathSegCurvetoCubicSmoothAbs(owningPathSegList, points.x, points.y, points.x2, points.y2);
- case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL:
- var points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new window.SVGPathSegCurvetoQuadraticRel(owningPathSegList, points.x, points.y, points.x1, points.y1);
- case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS:
- var points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new window.SVGPathSegCurvetoQuadraticAbs(owningPathSegList, points.x, points.y, points.x1, points.y1);
- case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL:
- return new window.SVGPathSegCurvetoQuadraticSmoothRel(owningPathSegList, this._parseNumber(), this._parseNumber());
- case window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS:
- return new window.SVGPathSegCurvetoQuadraticSmoothAbs(owningPathSegList, this._parseNumber(), this._parseNumber());
- case window.SVGPathSeg.PATHSEG_ARC_REL:
- var points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- arcAngle: this._parseNumber(),
- arcLarge: this._parseArcFlag(),
- arcSweep: this._parseArcFlag(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new window.SVGPathSegArcRel(owningPathSegList, points.x, points.y, points.x1, points.y1, points.arcAngle, points.arcLarge, points.arcSweep);
- case window.SVGPathSeg.PATHSEG_ARC_ABS:
- var points = {
- x1: this._parseNumber(),
- y1: this._parseNumber(),
- arcAngle: this._parseNumber(),
- arcLarge: this._parseArcFlag(),
- arcSweep: this._parseArcFlag(),
- x: this._parseNumber(),
- y: this._parseNumber()
- };
- return new window.SVGPathSegArcAbs(owningPathSegList, points.x, points.y, points.x1, points.y1, points.arcAngle, points.arcLarge, points.arcSweep);
- default:
- throw "Unknown path seg type.";
- }
- };
-
- var builder = new Builder();
- var source = new Source(string);
-
- if (!source.initialCommandIsMoveTo()) return [];
- while (source.hasMoreData()) {
- var pathSeg = source.parseSegment();
- if (!pathSeg) return [];
- builder.appendSegment(pathSeg);
- }
-
- return builder.pathSegList;
- };
- }
- })();
-
- // String.padEnd polyfill for IE11
- //
- // https://github.com/uxitten/polyfill/blob/master/string.polyfill.js
- // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padEnd
- if (!String.prototype.padEnd) {
- String.prototype.padEnd = function padEnd(targetLength, padString) {
- targetLength = targetLength >> 0; //floor if number or convert non-number to 0;
- padString = String(typeof padString !== 'undefined' ? padString : ' ');
- if (this.length > targetLength) {
- return String(this);
- } else {
- targetLength = targetLength - this.length;
- if (targetLength > padString.length) {
- padString += padString.repeat(targetLength / padString.length); //append to original to ensure we are longer than needed
- }
- return String(this) + padString.slice(0, targetLength);
- }
- };
+ ChartInternal.prototype.smoothLines = function (el, type) {
+ var $$ = this;
+
+ if (type === 'grid') {
+ el.each(function () {
+ var g = $$.d3.select(this),
+ x1 = g.attr('x1'),
+ x2 = g.attr('x2'),
+ y1 = g.attr('y1'),
+ y2 = g.attr('y2');
+ g.attr({
+ 'x1': Math.ceil(x1),
+ 'x2': Math.ceil(x2),
+ 'y1': Math.ceil(y1),
+ 'y2': Math.ceil(y2)
+ });
+ });
+ }
+ };
+
+ ChartInternal.prototype.updateSizes = function () {
+ var $$ = this,
+ config = $$.config;
+ var legendHeight = $$.legend ? $$.getLegendHeight() : 0,
+ legendWidth = $$.legend ? $$.getLegendWidth() : 0,
+ legendHeightForBottom = $$.isLegendRight || $$.isLegendInset ? 0 : legendHeight,
+ hasArc = $$.hasArcType(),
+ xAxisHeight = config.axis_rotated || hasArc ? 0 : $$.getHorizontalAxisHeight('x'),
+ subchartHeight = config.subchart_show && !hasArc ? config.subchart_size_height + xAxisHeight : 0;
+ $$.currentWidth = $$.getCurrentWidth();
+ $$.currentHeight = $$.getCurrentHeight(); // for main
+
+ $$.margin = config.axis_rotated ? {
+ top: $$.getHorizontalAxisHeight('y2') + $$.getCurrentPaddingTop(),
+ right: hasArc ? 0 : $$.getCurrentPaddingRight(),
+ bottom: $$.getHorizontalAxisHeight('y') + legendHeightForBottom + $$.getCurrentPaddingBottom(),
+ left: subchartHeight + (hasArc ? 0 : $$.getCurrentPaddingLeft())
+ } : {
+ top: 4 + $$.getCurrentPaddingTop(),
+ // for top tick text
+ right: hasArc ? 0 : $$.getCurrentPaddingRight(),
+ bottom: xAxisHeight + subchartHeight + legendHeightForBottom + $$.getCurrentPaddingBottom(),
+ left: hasArc ? 0 : $$.getCurrentPaddingLeft()
+ }; // for subchart
+
+ $$.margin2 = config.axis_rotated ? {
+ top: $$.margin.top,
+ right: NaN,
+ bottom: 20 + legendHeightForBottom,
+ left: $$.rotated_padding_left
+ } : {
+ top: $$.currentHeight - subchartHeight - legendHeightForBottom,
+ right: NaN,
+ bottom: xAxisHeight + legendHeightForBottom,
+ left: $$.margin.left
+ }; // for legend
+
+ $$.margin3 = {
+ top: 0,
+ right: NaN,
+ bottom: 0,
+ left: 0
+ };
+
+ if ($$.updateSizeForLegend) {
+ $$.updateSizeForLegend(legendHeight, legendWidth);
}
- /* jshint ignore:end */
+ $$.width = $$.currentWidth - $$.margin.left - $$.margin.right;
+ $$.height = $$.currentHeight - $$.margin.top - $$.margin.bottom;
- Chart.prototype.axis = function () {};
- Chart.prototype.axis.labels = function (labels) {
- var $$ = this.internal;
- if (arguments.length) {
- Object.keys(labels).forEach(function (axisId) {
- $$.axis.setLabelText(axisId, labels[axisId]);
- });
- $$.axis.updateLabels();
- }
- // TODO: return some values?
- };
- Chart.prototype.axis.max = function (max) {
- var $$ = this.internal,
- config = $$.config;
- if (arguments.length) {
- if ((typeof max === 'undefined' ? 'undefined' : _typeof(max)) === 'object') {
- if (isValue(max.x)) {
- config.axis_x_max = max.x;
- }
- if (isValue(max.y)) {
- config.axis_y_max = max.y;
- }
- if (isValue(max.y2)) {
- config.axis_y2_max = max.y2;
- }
- } else {
- config.axis_y_max = config.axis_y2_max = max;
- }
- $$.redraw({ withUpdateOrgXDomain: true, withUpdateXDomain: true });
- } else {
- return {
- x: config.axis_x_max,
- y: config.axis_y_max,
- y2: config.axis_y2_max
- };
- }
- };
- Chart.prototype.axis.min = function (min) {
- var $$ = this.internal,
- config = $$.config;
- if (arguments.length) {
- if ((typeof min === 'undefined' ? 'undefined' : _typeof(min)) === 'object') {
- if (isValue(min.x)) {
- config.axis_x_min = min.x;
- }
- if (isValue(min.y)) {
- config.axis_y_min = min.y;
- }
- if (isValue(min.y2)) {
- config.axis_y2_min = min.y2;
- }
- } else {
- config.axis_y_min = config.axis_y2_min = min;
- }
- $$.redraw({ withUpdateOrgXDomain: true, withUpdateXDomain: true });
- } else {
- return {
- x: config.axis_x_min,
- y: config.axis_y_min,
- y2: config.axis_y2_min
- };
- }
- };
- Chart.prototype.axis.range = function (range) {
- if (arguments.length) {
- if (isDefined(range.max)) {
- this.axis.max(range.max);
- }
- if (isDefined(range.min)) {
- this.axis.min(range.min);
- }
- } else {
- return {
- max: this.axis.max(),
- min: this.axis.min()
- };
- }
- };
-
- Chart.prototype.category = function (i, category) {
- var $$ = this.internal,
- config = $$.config;
- if (arguments.length > 1) {
- config.axis_x_categories[i] = category;
- $$.redraw();
- }
- return config.axis_x_categories[i];
- };
- Chart.prototype.categories = function (categories) {
- var $$ = this.internal,
- config = $$.config;
- if (!arguments.length) {
- return config.axis_x_categories;
- }
- config.axis_x_categories = categories;
- $$.redraw();
- return config.axis_x_categories;
- };
+ if ($$.width < 0) {
+ $$.width = 0;
+ }
- Chart.prototype.resize = function (size) {
- var $$ = this.internal,
- config = $$.config;
- config.size_width = size ? size.width : null;
- config.size_height = size ? size.height : null;
- this.flush();
- };
+ if ($$.height < 0) {
+ $$.height = 0;
+ }
- Chart.prototype.flush = function () {
- var $$ = this.internal;
- $$.updateAndRedraw({ withLegend: true, withTransition: false, withTransitionForTransform: false });
- };
+ $$.width2 = config.axis_rotated ? $$.margin.left - $$.rotated_padding_left - $$.rotated_padding_right : $$.width;
+ $$.height2 = config.axis_rotated ? $$.height : $$.currentHeight - $$.margin2.top - $$.margin2.bottom;
- Chart.prototype.destroy = function () {
- var $$ = this.internal;
+ if ($$.width2 < 0) {
+ $$.width2 = 0;
+ }
- window.clearInterval($$.intervalForObserveInserted);
+ if ($$.height2 < 0) {
+ $$.height2 = 0;
+ } // for arc
- if ($$.resizeTimeout !== undefined) {
- window.clearTimeout($$.resizeTimeout);
- }
- if (window.detachEvent) {
- window.detachEvent('onresize', $$.resizeIfElementDisplayed);
- } else if (window.removeEventListener) {
- window.removeEventListener('resize', $$.resizeIfElementDisplayed);
- } else {
- var wrapper = window.onresize;
- // check if no one else removed our wrapper and remove our resizeFunction from it
- if (wrapper && wrapper.add && wrapper.remove) {
- wrapper.remove($$.resizeFunction);
- }
- }
+ $$.arcWidth = $$.width - ($$.isLegendRight ? legendWidth + 10 : 0);
+ $$.arcHeight = $$.height - ($$.isLegendRight ? 0 : 10);
- // remove the inner resize functions
- $$.resizeFunction.remove();
+ if ($$.hasType('gauge') && !config.gauge_fullCircle) {
+ $$.arcHeight += $$.height - $$.getGaugeLabelHeight();
+ }
- $$.selectChart.classed('c3', false).html("");
+ if ($$.updateRadius) {
+ $$.updateRadius();
+ }
- // 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;
- });
+ if ($$.isLegendRight && hasArc) {
+ $$.margin3.left = $$.arcWidth / 2 + $$.radiusExpanded * 1.1;
+ }
+ };
- return null;
- };
+ ChartInternal.prototype.updateTargets = function (targets) {
+ var $$ = this;
+ /*-- Main --*/
+ //-- Text --//
- // TODO: fix
- Chart.prototype.color = function (id) {
- var $$ = this.internal;
- return $$.color(id); // more patterns
- };
+ $$.updateTargetsForText(targets); //-- Bar --//
- Chart.prototype.data = function (targetIds) {
- var targets = this.internal.data.targets;
- return typeof targetIds === 'undefined' ? targets : targets.filter(function (t) {
- return [].concat(targetIds).indexOf(t.id) >= 0;
- });
- };
- Chart.prototype.data.shown = function (targetIds) {
- return this.internal.filterTargetsToShow(this.data(targetIds));
- };
- Chart.prototype.data.values = function (targetId) {
- var targets,
- values = null;
- if (targetId) {
- targets = this.data(targetId);
- values = targets[0] ? targets[0].values.map(function (d) {
- return d.value;
- }) : null;
- }
- return values;
- };
- Chart.prototype.data.names = function (names) {
- this.internal.clearLegendItemTextBoxCache();
- return this.internal.updateDataAttributes('names', names);
- };
- Chart.prototype.data.colors = function (colors) {
- return this.internal.updateDataAttributes('colors', colors);
- };
- Chart.prototype.data.axes = function (axes) {
- return this.internal.updateDataAttributes('axes', axes);
- };
+ $$.updateTargetsForBar(targets); //-- Line --//
- Chart.prototype.flow = function (args) {
- var $$ = this.internal,
- targets,
- data,
- notfoundIds = [],
- orgDataCount = $$.getMaxDataCount(),
- dataCount,
- domain,
- baseTarget,
- baseValue,
- length = 0,
- tail = 0,
- diff,
- to;
-
- if (args.json) {
- data = $$.convertJsonToData(args.json, args.keys);
- } else if (args.rows) {
- data = $$.convertRowsToData(args.rows);
- } else if (args.columns) {
- data = $$.convertColumnsToData(args.columns);
- } else {
- return;
- }
- targets = $$.convertDataToTargets(data, true);
-
- // Update/Add data
- $$.data.targets.forEach(function (t) {
- var found = false,
- i,
- j;
- for (i = 0; i < targets.length; i++) {
- if (t.id === targets[i].id) {
- found = true;
-
- if (t.values[t.values.length - 1]) {
- tail = t.values[t.values.length - 1].index + 1;
- }
- length = targets[i].values.length;
-
- for (j = 0; j < length; j++) {
- targets[i].values[j].index = tail + j;
- if (!$$.isTimeSeries()) {
- targets[i].values[j].x = tail + j;
- }
- }
- t.values = t.values.concat(targets[i].values);
-
- targets.splice(i, 1);
- break;
- }
- }
- if (!found) {
- notfoundIds.push(t.id);
- }
- });
+ $$.updateTargetsForLine(targets); //-- Arc --//
- // Append null for not found targets
- $$.data.targets.forEach(function (t) {
- var i, j;
- for (i = 0; i < notfoundIds.length; i++) {
- if (t.id === notfoundIds[i]) {
- tail = t.values[t.values.length - 1].index + 1;
- for (j = 0; j < length; j++) {
- t.values.push({
- id: t.id,
- index: tail + j,
- x: $$.isTimeSeries() ? $$.getOtherTargetX(tail + j) : tail + j,
- value: null
- });
- }
- }
- }
- });
+ if ($$.hasArcType() && $$.updateTargetsForArc) {
+ $$.updateTargetsForArc(targets);
+ }
+ /*-- Sub --*/
+
+
+ if ($$.updateTargetsForSubchart) {
+ $$.updateTargetsForSubchart(targets);
+ } // Fade-in each chart
+
+
+ $$.showTargets();
+ };
+
+ ChartInternal.prototype.showTargets = function () {
+ var $$ = this;
+ $$.svg.selectAll('.' + CLASS.target).filter(function (d) {
+ return $$.isTargetToShow(d.id);
+ }).transition().duration($$.config.transition_duration).style("opacity", 1);
+ };
+
+ ChartInternal.prototype.redraw = function (options, transitions) {
+ var $$ = this,
+ main = $$.main,
+ d3 = $$.d3,
+ config = $$.config;
+ var areaIndices = $$.getShapeIndices($$.isAreaType),
+ barIndices = $$.getShapeIndices($$.isBarType),
+ lineIndices = $$.getShapeIndices($$.isLineType);
+ var withY, withSubchart, withTransition, withTransitionForExit, withTransitionForAxis, withTransform, withUpdateXDomain, withUpdateOrgXDomain, withTrimXDomain, withLegend, withEventRect, withDimension, withUpdateXAxis;
+ var hideAxis = $$.hasArcType();
+ var drawArea, drawBar, drawLine, xForText, yForText;
+ var duration, durationForExit, durationForAxis;
+ var transitionsToWait, waitForDraw, flow, transition;
+ var targetsToShow = $$.filterTargetsToShow($$.data.targets),
+ tickValues,
+ i,
+ intervalForCulling,
+ xDomainForZoom;
+ var xv = $$.xv.bind($$),
+ cx,
+ cy;
+ options = options || {};
+ withY = getOption(options, "withY", true);
+ withSubchart = getOption(options, "withSubchart", true);
+ withTransition = getOption(options, "withTransition", true);
+ withTransform = getOption(options, "withTransform", false);
+ withUpdateXDomain = getOption(options, "withUpdateXDomain", false);
+ withUpdateOrgXDomain = getOption(options, "withUpdateOrgXDomain", false);
+ withTrimXDomain = getOption(options, "withTrimXDomain", true);
+ withUpdateXAxis = getOption(options, "withUpdateXAxis", withUpdateXDomain);
+ withLegend = getOption(options, "withLegend", false);
+ withEventRect = getOption(options, "withEventRect", true);
+ withDimension = getOption(options, "withDimension", true);
+ withTransitionForExit = getOption(options, "withTransitionForExit", withTransition);
+ withTransitionForAxis = getOption(options, "withTransitionForAxis", withTransition);
+ duration = withTransition ? config.transition_duration : 0;
+ durationForExit = withTransitionForExit ? duration : 0;
+ durationForAxis = withTransitionForAxis ? duration : 0;
+ transitions = transitions || $$.axis.generateTransitions(durationForAxis); // update legend and transform each g
+
+ if (withLegend && config.legend_show) {
+ $$.updateLegend($$.mapToIds($$.data.targets), options, transitions);
+ } else if (withDimension) {
+ // need to update dimension (e.g. axis.y.tick.values) because y tick values should change
+ // no need to update axis in it because they will be updated in redraw()
+ $$.updateDimension(true);
+ } // MEMO: needed for grids calculation
+
+
+ if ($$.isCategorized() && targetsToShow.length === 0) {
+ $$.x.domain([0, $$.axes.x.selectAll('.tick').size()]);
+ }
- // Generate null values for new target
- if ($$.data.targets.length) {
- targets.forEach(function (t) {
- var i,
- missing = [];
- for (i = $$.data.targets[0].values[0].index; i < tail; i++) {
- missing.push({
- id: t.id,
- index: i,
- x: $$.isTimeSeries() ? $$.getOtherTargetX(i) : i,
- value: null
- });
- }
- t.values.forEach(function (v) {
- v.index += tail;
- if (!$$.isTimeSeries()) {
- v.x += tail;
- }
- });
- t.values = missing.concat(t.values);
- });
- }
- $$.data.targets = $$.data.targets.concat(targets); // add remained
-
- // check data count because behavior needs to change when it's only one
- dataCount = $$.getMaxDataCount();
- baseTarget = $$.data.targets[0];
- baseValue = baseTarget.values[0];
-
- // Update length to flow if needed
- if (isDefined(args.to)) {
- length = 0;
- to = $$.isTimeSeries() ? $$.parseDate(args.to) : args.to;
- baseTarget.values.forEach(function (v) {
- if (v.x < to) {
- length++;
- }
- });
- } else if (isDefined(args.length)) {
- length = args.length;
- }
+ if (targetsToShow.length) {
+ $$.updateXDomain(targetsToShow, withUpdateXDomain, withUpdateOrgXDomain, withTrimXDomain);
- // If only one data, update the domain to flow from left edge of the chart
- if (!orgDataCount) {
- if ($$.isTimeSeries()) {
- if (baseTarget.values.length > 1) {
- diff = baseTarget.values[baseTarget.values.length - 1].x - baseValue.x;
- } else {
- diff = baseValue.x - $$.getXDomain($$.data.targets)[0];
- }
- } else {
- diff = 1;
- }
- domain = [baseValue.x - diff, baseValue.x];
- $$.updateXDomain(null, true, true, false, domain);
- } else if (orgDataCount === 1) {
- if ($$.isTimeSeries()) {
- diff = (baseTarget.values[baseTarget.values.length - 1].x - baseValue.x) / 2;
- domain = [new Date(+baseValue.x - diff), new Date(+baseValue.x + diff)];
- $$.updateXDomain(null, true, true, false, domain);
- }
- }
+ if (!config.axis_x_tick_values) {
+ tickValues = $$.axis.updateXAxisTickValues(targetsToShow);
+ }
+ } else {
+ $$.xAxis.tickValues([]);
+ $$.subXAxis.tickValues([]);
+ }
- // Set targets
- $$.updateTargets($$.data.targets);
+ if (config.zoom_rescale && !options.flow) {
+ xDomainForZoom = $$.x.orgDomain();
+ }
- // Redraw with new targets
- $$.redraw({
- flow: {
- index: baseValue.index,
- length: length,
- duration: isValue(args.duration) ? args.duration : $$.config.transition_duration,
- done: args.done,
- orgDataCount: orgDataCount
- },
- withLegend: true,
- withTransition: orgDataCount > 1,
- withTrimXDomain: false,
- withUpdateXAxis: true
- });
- };
+ $$.y.domain($$.getYDomain(targetsToShow, 'y', xDomainForZoom));
+ $$.y2.domain($$.getYDomain(targetsToShow, 'y2', xDomainForZoom));
- ChartInternal.prototype.generateFlow = function (args) {
- var $$ = this,
- config = $$.config,
- d3 = $$.d3;
+ if (!config.axis_y_tick_values && config.axis_y_tick_count) {
+ $$.yAxis.tickValues($$.axis.generateTickValues($$.y.domain(), config.axis_y_tick_count));
+ }
- return function () {
- var targets = args.targets,
- flow = args.flow,
- drawBar = args.drawBar,
- drawLine = args.drawLine,
- drawArea = args.drawArea,
- cx = args.cx,
- cy = args.cy,
- xv = args.xv,
- xForText = args.xForText,
- yForText = args.yForText,
- duration = args.duration;
-
- var translateX,
- scaleX = 1,
- transform,
- flowIndex = flow.index,
- flowLength = flow.length,
- flowStart = $$.getValueOnIndex($$.data.targets[0].values, flowIndex),
- flowEnd = $$.getValueOnIndex($$.data.targets[0].values, flowIndex + flowLength),
- orgDomain = $$.x.domain(),
- domain,
- durationForFlow = flow.duration || duration,
- done = flow.done || function () {},
- wait = $$.generateWait();
-
- var xgrid, xgridLines, mainRegion, mainText, mainBar, mainLine, mainArea, mainCircle;
-
- // set flag
- $$.flowing = true;
-
- // remove head data after rendered
- $$.data.targets.forEach(function (d) {
- d.values.splice(0, flowLength);
- });
+ if (!config.axis_y2_tick_values && config.axis_y2_tick_count) {
+ $$.y2Axis.tickValues($$.axis.generateTickValues($$.y2.domain(), config.axis_y2_tick_count));
+ } // axes
- // update x domain to generate axis elements for flow
- domain = $$.updateXDomain(targets, true, true);
- // update elements related to x scale
- if ($$.updateXGrid) {
- $$.updateXGrid(true);
- }
- xgrid = $$.xgrid || d3.selectAll([]); // xgrid needs to be obtained after updateXGrid
- xgridLines = $$.xgridLines || d3.selectAll([]);
- mainRegion = $$.mainRegion || d3.selectAll([]);
- mainText = $$.mainText || d3.selectAll([]);
- mainBar = $$.mainBar || d3.selectAll([]);
- mainLine = $$.mainLine || d3.selectAll([]);
- mainArea = $$.mainArea || d3.selectAll([]);
- mainCircle = $$.mainCircle || d3.selectAll([]);
-
- // generate transform to flow
- if (!flow.orgDataCount) {
- // if empty
- if ($$.data.targets[0].values.length !== 1) {
- translateX = $$.x(orgDomain[0]) - $$.x(domain[0]);
- } else {
- if ($$.isTimeSeries()) {
- flowStart = $$.getValueOnIndex($$.data.targets[0].values, 0);
- flowEnd = $$.getValueOnIndex($$.data.targets[0].values, $$.data.targets[0].values.length - 1);
- translateX = $$.x(flowStart.x) - $$.x(flowEnd.x);
- } else {
- translateX = diffDomain(domain) / 2;
- }
- }
- } else if (flow.orgDataCount === 1 || (flowStart && flowStart.x) === (flowEnd && flowEnd.x)) {
- translateX = $$.x(orgDomain[0]) - $$.x(domain[0]);
- } else {
- if ($$.isTimeSeries()) {
- translateX = $$.x(orgDomain[0]) - $$.x(domain[0]);
- } else {
- translateX = $$.x(flowStart.x) - $$.x(flowEnd.x);
- }
- }
- scaleX = diffDomain(orgDomain) / diffDomain(domain);
- transform = 'translate(' + translateX + ',0) scale(' + scaleX + ',1)';
-
- $$.hideXGridFocus();
-
- var flowTransition = d3.transition().ease(d3.easeLinear).duration(durationForFlow);
- wait.add($$.xAxis($$.axes.x, flowTransition));
- wait.add(mainBar.transition(flowTransition).attr('transform', transform));
- wait.add(mainLine.transition(flowTransition).attr('transform', transform));
- wait.add(mainArea.transition(flowTransition).attr('transform', transform));
- wait.add(mainCircle.transition(flowTransition).attr('transform', transform));
- wait.add(mainText.transition(flowTransition).attr('transform', transform));
- wait.add(mainRegion.filter($$.isRegionOnX).transition(flowTransition).attr('transform', transform));
- wait.add(xgrid.transition(flowTransition).attr('transform', transform));
- wait.add(xgridLines.transition(flowTransition).attr('transform', transform));
- wait(function () {
- var i,
- shapes = [],
- texts = [];
-
- // remove flowed elements
- if (flowLength) {
- for (i = 0; i < flowLength; i++) {
- shapes.push('.' + CLASS.shape + '-' + (flowIndex + i));
- texts.push('.' + CLASS.text + '-' + (flowIndex + i));
- }
- $$.svg.selectAll('.' + CLASS.shapes).selectAll(shapes).remove();
- $$.svg.selectAll('.' + CLASS.texts).selectAll(texts).remove();
- $$.svg.select('.' + CLASS.xgrid).remove();
- }
-
- // draw again for removing flowed elements and reverting attr
- xgrid.attr('transform', null).attr('x1', $$.xgridAttr.x1).attr('x2', $$.xgridAttr.x2).attr('y1', $$.xgridAttr.y1).attr('y2', $$.xgridAttr.y2).style("opacity", $$.xgridAttr.opacity);
- xgridLines.attr('transform', null);
- xgridLines.select('line').attr("x1", config.axis_rotated ? 0 : xv).attr("x2", config.axis_rotated ? $$.width : xv);
- xgridLines.select('text').attr("x", config.axis_rotated ? $$.width : 0).attr("y", xv);
- mainBar.attr('transform', null).attr("d", drawBar);
- mainLine.attr('transform', null).attr("d", drawLine);
- mainArea.attr('transform', null).attr("d", drawArea);
- mainCircle.attr('transform', null).attr("cx", cx).attr("cy", cy);
- mainText.attr('transform', null).attr('x', xForText).attr('y', yForText).style('fill-opacity', $$.opacityForText.bind($$));
- mainRegion.attr('transform', null);
- mainRegion.filter($$.isRegionOnX).attr("x", $$.regionX.bind($$)).attr("width", $$.regionWidth.bind($$));
-
- // callback for end of flow
- done();
-
- $$.flowing = false;
- });
- };
- };
+ $$.axis.redraw(durationForAxis, hideAxis); // Update axis label
- Chart.prototype.focus = function (targetIds) {
- var $$ = this.internal,
- candidates;
+ $$.axis.updateLabels(withTransition); // show/hide if manual culling needed
- targetIds = $$.mapToTargetIds(targetIds);
- candidates = $$.svg.selectAll($$.selectorTargets(targetIds.filter($$.isTargetToShow, $$))), this.revert();
- this.defocus();
- candidates.classed(CLASS.focused, true).classed(CLASS.defocused, false);
- if ($$.hasArcType()) {
- $$.expandArc(targetIds);
+ if ((withUpdateXDomain || withUpdateXAxis) && targetsToShow.length) {
+ if (config.axis_x_tick_culling && tickValues) {
+ for (i = 1; i < tickValues.length; i++) {
+ if (tickValues.length / i < config.axis_x_tick_culling_max) {
+ intervalForCulling = i;
+ break;
+ }
}
- $$.toggleFocusLegend(targetIds, true);
- $$.focusedTargetIds = targetIds;
- $$.defocusedTargetIds = $$.defocusedTargetIds.filter(function (id) {
- return targetIds.indexOf(id) < 0;
+ $$.svg.selectAll('.' + CLASS.axisX + ' .tick text').each(function (e) {
+ var index = tickValues.indexOf(e);
+
+ if (index >= 0) {
+ d3.select(this).style('display', index % intervalForCulling ? 'none' : 'block');
+ }
});
- };
+ } else {
+ $$.svg.selectAll('.' + CLASS.axisX + ' .tick text').style('display', 'block');
+ }
+ } // setup drawer - MEMO: these must be called after axis updated
- Chart.prototype.defocus = function (targetIds) {
- var $$ = this.internal,
- candidates;
- targetIds = $$.mapToTargetIds(targetIds);
- candidates = $$.svg.selectAll($$.selectorTargets(targetIds.filter($$.isTargetToShow, $$))), candidates.classed(CLASS.focused, false).classed(CLASS.defocused, true);
- if ($$.hasArcType()) {
- $$.unexpandArc(targetIds);
- }
- $$.toggleFocusLegend(targetIds, false);
+ drawArea = $$.generateDrawArea ? $$.generateDrawArea(areaIndices, false) : undefined;
+ drawBar = $$.generateDrawBar ? $$.generateDrawBar(barIndices) : undefined;
+ drawLine = $$.generateDrawLine ? $$.generateDrawLine(lineIndices, false) : undefined;
+ xForText = $$.generateXYForText(areaIndices, barIndices, lineIndices, true);
+ yForText = $$.generateXYForText(areaIndices, barIndices, lineIndices, false); // update circleY based on updated parameters
- $$.focusedTargetIds = $$.focusedTargetIds.filter(function (id) {
- return targetIds.indexOf(id) < 0;
- });
- $$.defocusedTargetIds = targetIds;
- };
+ $$.updateCircleY(); // generate circle x/y functions depending on updated params
- Chart.prototype.revert = function (targetIds) {
- var $$ = this.internal,
- candidates;
+ cx = ($$.config.axis_rotated ? $$.circleY : $$.circleX).bind($$);
+ cy = ($$.config.axis_rotated ? $$.circleX : $$.circleY).bind($$); // Update sub domain
- targetIds = $$.mapToTargetIds(targetIds);
- candidates = $$.svg.selectAll($$.selectorTargets(targetIds)); // should be for all targets
+ if (withY) {
+ $$.subY.domain($$.getYDomain(targetsToShow, 'y'));
+ $$.subY2.domain($$.getYDomain(targetsToShow, 'y2'));
+ } // xgrid focus
- candidates.classed(CLASS.focused, false).classed(CLASS.defocused, false);
- if ($$.hasArcType()) {
- $$.unexpandArc(targetIds);
- }
- if ($$.config.legend_show) {
- $$.showLegend(targetIds.filter($$.isLegendToShow.bind($$)));
- $$.legend.selectAll($$.selectorLegends(targetIds)).filter(function () {
- return $$.d3.select(this).classed(CLASS.legendItemFocused);
- }).classed(CLASS.legendItemFocused, false);
- }
- $$.focusedTargetIds = [];
- $$.defocusedTargetIds = [];
- };
+ $$.updateXgridFocus(); // Data empty label positioning and text.
- Chart.prototype.xgrids = function (grids) {
- var $$ = this.internal,
- config = $$.config;
- if (!grids) {
- return config.grid_x_lines;
- }
- config.grid_x_lines = grids;
- $$.redrawWithoutRescale();
- return config.grid_x_lines;
- };
- Chart.prototype.xgrids.add = function (grids) {
- var $$ = this.internal;
- return this.xgrids($$.config.grid_x_lines.concat(grids ? grids : []));
- };
- Chart.prototype.xgrids.remove = function (params) {
- // TODO: multiple
- var $$ = this.internal;
- $$.removeGridLines(params, true);
- };
+ main.select("text." + CLASS.text + '.' + CLASS.empty).attr("x", $$.width / 2).attr("y", $$.height / 2).text(config.data_empty_label_text).transition().style('opacity', targetsToShow.length ? 0 : 1); // event rect
- Chart.prototype.ygrids = function (grids) {
- var $$ = this.internal,
- config = $$.config;
- if (!grids) {
- return config.grid_y_lines;
- }
- config.grid_y_lines = grids;
- $$.redrawWithoutRescale();
- return config.grid_y_lines;
- };
- Chart.prototype.ygrids.add = function (grids) {
- var $$ = this.internal;
- return this.ygrids($$.config.grid_y_lines.concat(grids ? grids : []));
- };
- Chart.prototype.ygrids.remove = function (params) {
- // TODO: multiple
- var $$ = this.internal;
- $$.removeGridLines(params, false);
- };
+ if (withEventRect) {
+ $$.redrawEventRect();
+ } // grid
- Chart.prototype.groups = function (groups) {
- var $$ = this.internal,
- config = $$.config;
- if (isUndefined(groups)) {
- return config.data_groups;
- }
- config.data_groups = groups;
- $$.redraw();
- return config.data_groups;
- };
- Chart.prototype.legend = function () {};
- Chart.prototype.legend.show = function (targetIds) {
- var $$ = this.internal;
- $$.showLegend($$.mapToTargetIds(targetIds));
- $$.updateAndRedraw({ withLegend: true });
- };
- Chart.prototype.legend.hide = function (targetIds) {
- var $$ = this.internal;
- $$.hideLegend($$.mapToTargetIds(targetIds));
- $$.updateAndRedraw({ withLegend: false });
- };
+ $$.updateGrid(duration); // rect for regions
- Chart.prototype.load = function (args) {
- var $$ = this.internal,
- config = $$.config;
- // update xs if specified
- if (args.xs) {
- $$.addXs(args.xs);
- }
- // update names if exists
- if ('names' in args) {
- Chart.prototype.data.names.bind(this)(args.names);
- }
- // update classes if exists
- if ('classes' in args) {
- Object.keys(args.classes).forEach(function (id) {
- config.data_classes[id] = args.classes[id];
- });
- }
- // update categories if exists
- if ('categories' in args && $$.isCategorized()) {
- config.axis_x_categories = args.categories;
- }
- // update axes if exists
- if ('axes' in args) {
- Object.keys(args.axes).forEach(function (id) {
- config.data_axes[id] = args.axes[id];
- });
- }
- // update colors if exists
- if ('colors' in args) {
- Object.keys(args.colors).forEach(function (id) {
- config.data_colors[id] = args.colors[id];
- });
- }
- // use cache if exists
- if ('cacheIds' in args && $$.hasCaches(args.cacheIds)) {
- $$.load($$.getCaches(args.cacheIds), args.done);
- return;
- }
- // unload if needed
- if ('unload' in args) {
- // TODO: do not unload if target will load (included in url/rows/columns)
- $$.unload($$.mapToTargetIds(typeof args.unload === 'boolean' && args.unload ? null : args.unload), function () {
- $$.loadFromArgs(args);
- });
- } else {
- $$.loadFromArgs(args);
- }
- };
+ $$.updateRegion(duration); // bars
- Chart.prototype.unload = function (args) {
- var $$ = this.internal;
- args = args || {};
- if (args instanceof Array) {
- args = { ids: args };
- } else if (typeof args === 'string') {
- args = { ids: [args] };
- }
- $$.unload($$.mapToTargetIds(args.ids), function () {
- $$.redraw({ withUpdateOrgXDomain: true, withUpdateXDomain: true, withLegend: true });
- if (args.done) {
- args.done();
- }
- });
- };
+ $$.updateBar(durationForExit); // lines, areas and cricles
- Chart.prototype.regions = function (regions) {
- var $$ = this.internal,
- config = $$.config;
- if (!regions) {
- return config.regions;
- }
- config.regions = regions;
- $$.redrawWithoutRescale();
- return config.regions;
- };
- Chart.prototype.regions.add = function (regions) {
- var $$ = this.internal,
- config = $$.config;
- if (!regions) {
- return config.regions;
- }
- config.regions = config.regions.concat(regions);
- $$.redrawWithoutRescale();
- return config.regions;
- };
- Chart.prototype.regions.remove = function (options) {
- var $$ = this.internal,
- config = $$.config,
- duration,
- classes,
- regions;
-
- options = options || {};
- duration = $$.getOption(options, "duration", config.transition_duration);
- classes = $$.getOption(options, "classes", [CLASS.region]);
-
- regions = $$.main.select('.' + CLASS.regions).selectAll(classes.map(function (c) {
- return '.' + c;
- }));
- (duration ? regions.transition().duration(duration) : regions).style('opacity', 0).remove();
-
- config.regions = config.regions.filter(function (region) {
- var found = false;
- if (!region['class']) {
- return true;
- }
- region['class'].split(' ').forEach(function (c) {
- if (classes.indexOf(c) >= 0) {
- found = true;
- }
- });
- return !found;
- });
+ $$.updateLine(durationForExit);
+ $$.updateArea(durationForExit);
+ $$.updateCircle(cx, cy); // text
- return config.regions;
- };
+ if ($$.hasDataLabel()) {
+ $$.updateText(xForText, yForText, durationForExit);
+ } // title
- Chart.prototype.selected = function (targetId) {
- var $$ = this.internal,
- d3 = $$.d3;
- return d3.merge($$.main.selectAll('.' + CLASS.shapes + $$.getTargetSelectorSuffix(targetId)).selectAll('.' + CLASS.shape).filter(function () {
- return d3.select(this).classed(CLASS.SELECTED);
- }).map(function (d) {
- return d.map(function (d) {
- var data = d.__data__;return data.data ? data.data : data;
- });
- }));
- };
- Chart.prototype.select = function (ids, indices, resetOther) {
- var $$ = this.internal,
- d3 = $$.d3,
- config = $$.config;
- if (!config.data_selection_enabled) {
- return;
- }
- $$.main.selectAll('.' + CLASS.shapes).selectAll('.' + CLASS.shape).each(function (d, i) {
- var shape = d3.select(this),
- id = d.data ? d.data.id : d.id,
- toggle = $$.getToggle(this, d).bind($$),
- isTargetId = config.data_selection_grouped || !ids || ids.indexOf(id) >= 0,
- isTargetIndex = !indices || indices.indexOf(i) >= 0,
- isSelected = shape.classed(CLASS.SELECTED);
- // line/area selection not supported yet
- if (shape.classed(CLASS.line) || shape.classed(CLASS.area)) {
- return;
- }
- if (isTargetId && isTargetIndex) {
- if (config.data_selection_isselectable(d) && !isSelected) {
- toggle(true, shape.classed(CLASS.SELECTED, true), d, i);
- }
- } else if (isDefined(resetOther) && resetOther) {
- if (isSelected) {
- toggle(false, shape.classed(CLASS.SELECTED, false), d, i);
- }
- }
- });
- };
- Chart.prototype.unselect = function (ids, indices) {
- var $$ = this.internal,
- d3 = $$.d3,
- config = $$.config;
- if (!config.data_selection_enabled) {
- return;
- }
- $$.main.selectAll('.' + CLASS.shapes).selectAll('.' + CLASS.shape).each(function (d, i) {
- var shape = d3.select(this),
- id = d.data ? d.data.id : d.id,
- toggle = $$.getToggle(this, d).bind($$),
- isTargetId = config.data_selection_grouped || !ids || ids.indexOf(id) >= 0,
- isTargetIndex = !indices || indices.indexOf(i) >= 0,
- isSelected = shape.classed(CLASS.SELECTED);
- // line/area selection not supported yet
- if (shape.classed(CLASS.line) || shape.classed(CLASS.area)) {
- return;
- }
- if (isTargetId && isTargetIndex) {
- if (config.data_selection_isselectable(d)) {
- if (isSelected) {
- toggle(false, shape.classed(CLASS.SELECTED, false), d, i);
- }
- }
- }
- });
- };
- Chart.prototype.show = function (targetIds, options) {
- var $$ = this.internal,
- targets;
+ if ($$.redrawTitle) {
+ $$.redrawTitle();
+ } // arc
- targetIds = $$.mapToTargetIds(targetIds);
- options = options || {};
- $$.removeHiddenTargetIds(targetIds);
- targets = $$.svg.selectAll($$.selectorTargets(targetIds));
+ if ($$.redrawArc) {
+ $$.redrawArc(duration, durationForExit, withTransform);
+ } // subchart
- targets.transition().style('display', 'initial', 'important').style('opacity', 1, 'important').call($$.endall, function () {
- targets.style('opacity', null).style('opacity', 1);
- });
- if (options.withLegend) {
- $$.showLegend(targetIds);
- }
+ if ($$.redrawSubchart) {
+ $$.redrawSubchart(withSubchart, transitions, duration, durationForExit, areaIndices, barIndices, lineIndices);
+ } // circles for select
- $$.redraw({ withUpdateOrgXDomain: true, withUpdateXDomain: true, withLegend: true });
- };
- Chart.prototype.hide = function (targetIds, options) {
- var $$ = this.internal,
- targets;
+ main.selectAll('.' + CLASS.selectedCircles).filter($$.isBarType.bind($$)).selectAll('circle').remove();
- targetIds = $$.mapToTargetIds(targetIds);
- options = options || {};
+ if (options.flow) {
+ flow = $$.generateFlow({
+ targets: targetsToShow,
+ flow: options.flow,
+ duration: options.flow.duration,
+ drawBar: drawBar,
+ drawLine: drawLine,
+ drawArea: drawArea,
+ cx: cx,
+ cy: cy,
+ xv: xv,
+ xForText: xForText,
+ yForText: yForText
+ });
+ }
- $$.addHiddenTargetIds(targetIds);
- targets = $$.svg.selectAll($$.selectorTargets(targetIds));
+ if ($$.isTabVisible()) {
+ // Only use transition if tab visible. See #938.
+ if (duration) {
+ // transition should be derived from one transition
+ transition = d3.transition().duration(duration);
+ transitionsToWait = [];
+ [$$.redrawBar(drawBar, true, transition), $$.redrawLine(drawLine, true, transition), $$.redrawArea(drawArea, true, transition), $$.redrawCircle(cx, cy, true, transition), $$.redrawText(xForText, yForText, options.flow, true, transition), $$.redrawRegion(true, transition), $$.redrawGrid(true, transition)].forEach(function (transitions) {
+ transitions.forEach(function (transition) {
+ transitionsToWait.push(transition);
+ });
+ }); // Wait for end of transitions to call flow and onrendered callback
- targets.transition().style('opacity', 0, 'important').call($$.endall, function () {
- targets.style('opacity', null).style('opacity', 0);
- targets.style('display', 'none');
+ waitForDraw = $$.generateWait();
+ transitionsToWait.forEach(function (t) {
+ waitForDraw.add(t);
});
+ waitForDraw(function () {
+ if (flow) {
+ flow();
+ }
+
+ if (config.onrendered) {
+ config.onrendered.call($$);
+ }
+ });
+ } else {
+ $$.redrawBar(drawBar);
+ $$.redrawLine(drawLine);
+ $$.redrawArea(drawArea);
+ $$.redrawCircle(cx, cy);
+ $$.redrawText(xForText, yForText, options.flow);
+ $$.redrawRegion();
+ $$.redrawGrid();
- if (options.withLegend) {
- $$.hideLegend(targetIds);
+ if (flow) {
+ flow();
}
- $$.redraw({ withUpdateOrgXDomain: true, withUpdateXDomain: true, withLegend: true });
- };
+ if (config.onrendered) {
+ config.onrendered.call($$);
+ }
+ }
+ } // update fadein condition
+
+
+ $$.mapToIds($$.data.targets).forEach(function (id) {
+ $$.withoutFadeIn[id] = true;
+ });
+ };
+
+ ChartInternal.prototype.updateAndRedraw = function (options) {
+ var $$ = this,
+ config = $$.config,
+ transitions;
+ options = options || {}; // same with redraw
+
+ options.withTransition = getOption(options, "withTransition", true);
+ options.withTransform = getOption(options, "withTransform", false);
+ options.withLegend = getOption(options, "withLegend", false); // NOT same with redraw
+
+ options.withUpdateXDomain = getOption(options, "withUpdateXDomain", true);
+ options.withUpdateOrgXDomain = getOption(options, "withUpdateOrgXDomain", true);
+ options.withTransitionForExit = false;
+ options.withTransitionForTransform = getOption(options, "withTransitionForTransform", options.withTransition); // MEMO: this needs to be called before updateLegend and it means this ALWAYS needs to be called)
+
+ $$.updateSizes(); // MEMO: called in updateLegend in redraw if withLegend
+
+ if (!(options.withLegend && config.legend_show)) {
+ transitions = $$.axis.generateTransitions(options.withTransitionForAxis ? config.transition_duration : 0); // Update scales
+
+ $$.updateScales();
+ $$.updateSvgSize(); // Update g positions
+
+ $$.transformAll(options.withTransitionForTransform, transitions);
+ } // Draw with new sizes & scales
+
+
+ $$.redraw(options, transitions);
+ };
+
+ ChartInternal.prototype.redrawWithoutRescale = function () {
+ this.redraw({
+ withY: false,
+ withSubchart: false,
+ withEventRect: false,
+ withTransitionForAxis: false
+ });
+ };
+
+ ChartInternal.prototype.isTimeSeries = function () {
+ return this.config.axis_x_type === 'timeseries';
+ };
+
+ ChartInternal.prototype.isCategorized = function () {
+ return this.config.axis_x_type.indexOf('categor') >= 0;
+ };
+
+ ChartInternal.prototype.isCustomX = function () {
+ var $$ = this,
+ config = $$.config;
+ return !$$.isTimeSeries() && (config.data_x || notEmpty(config.data_xs));
+ };
+
+ ChartInternal.prototype.isTimeSeriesY = function () {
+ return this.config.axis_y_type === 'timeseries';
+ };
+
+ ChartInternal.prototype.getTranslate = function (target) {
+ var $$ = this,
+ config = $$.config,
+ x,
+ y;
+
+ if (target === 'main') {
+ x = asHalfPixel($$.margin.left);
+ y = asHalfPixel($$.margin.top);
+ } else if (target === 'context') {
+ x = asHalfPixel($$.margin2.left);
+ y = asHalfPixel($$.margin2.top);
+ } else if (target === 'legend') {
+ x = $$.margin3.left;
+ y = $$.margin3.top;
+ } else if (target === 'x') {
+ x = 0;
+ y = config.axis_rotated ? 0 : $$.height;
+ } else if (target === 'y') {
+ x = 0;
+ y = config.axis_rotated ? $$.height : 0;
+ } else if (target === 'y2') {
+ x = config.axis_rotated ? 0 : $$.width;
+ y = config.axis_rotated ? 1 : 0;
+ } else if (target === 'subx') {
+ x = 0;
+ y = config.axis_rotated ? 0 : $$.height2;
+ } else if (target === 'arc') {
+ x = $$.arcWidth / 2;
+ y = $$.arcHeight / 2 - ($$.hasType('gauge') ? 6 : 0); // to prevent wrong display of min and max label
+ }
- Chart.prototype.toggle = function (targetIds, options) {
- var that = this,
- $$ = this.internal;
- $$.mapToTargetIds(targetIds).forEach(function (targetId) {
- $$.isTargetToShow(targetId) ? that.hide(targetId, options) : that.show(targetId, options);
- });
- };
+ return "translate(" + x + "," + y + ")";
+ };
- Chart.prototype.tooltip = function () {};
- Chart.prototype.tooltip.show = function (args) {
- var $$ = this.internal,
- targets,
- data,
- mouse = {};
+ ChartInternal.prototype.initialOpacity = function (d) {
+ return d.value !== null && this.withoutFadeIn[d.id] ? 1 : 0;
+ };
- // determine mouse position on the chart
- if (args.mouse) {
- mouse = args.mouse;
- } else {
- // determine focus data
- if (args.data) {
- data = args.data;
- } else if (typeof args.x !== 'undefined') {
- if (args.id) {
- targets = $$.data.targets.filter(function (t) {
- return t.id === args.id;
- });
- } else {
- targets = $$.data.targets;
- }
- data = $$.filterByX(targets, args.x).slice(0, 1)[0];
- }
- mouse = data ? $$.getMousePosition(data) : null;
- }
+ ChartInternal.prototype.initialOpacityForCircle = function (d) {
+ return d.value !== null && this.withoutFadeIn[d.id] ? this.opacityForCircle(d) : 0;
+ };
- // emulate mouse events to show
- $$.dispatchEvent('mousemove', mouse);
+ ChartInternal.prototype.opacityForCircle = function (d) {
+ var isPointShouldBeShown = isFunction(this.config.point_show) ? this.config.point_show(d) : this.config.point_show;
+ var opacity = isPointShouldBeShown ? 1 : 0;
+ return isValue(d.value) ? this.isScatterType(d) ? 0.5 : opacity : 0;
+ };
- $$.config.tooltip_onshow.call($$, data);
- };
- Chart.prototype.tooltip.hide = function () {
- // TODO: get target data by checking the state of focus
- this.internal.dispatchEvent('mouseout', 0);
+ ChartInternal.prototype.opacityForText = function () {
+ return this.hasDataLabel() ? 1 : 0;
+ };
- this.internal.config.tooltip_onhide.call(this);
- };
+ ChartInternal.prototype.xx = function (d) {
+ return d ? this.x(d.x) : null;
+ };
- Chart.prototype.transform = function (type, targetIds) {
- var $$ = this.internal,
- options = ['pie', 'donut'].indexOf(type) >= 0 ? { withTransform: true } : null;
- $$.transformTo(targetIds, type, options);
- };
+ ChartInternal.prototype.xv = function (d) {
+ var $$ = this,
+ value = d.value;
- ChartInternal.prototype.transformTo = function (targetIds, type, optionsForRedraw) {
- var $$ = this,
- withTransitionForAxis = !$$.hasArcType(),
- options = optionsForRedraw || { withTransitionForAxis: withTransitionForAxis };
- options.withTransitionForTransform = false;
- $$.transiting = false;
- $$.setTargetType(targetIds, type);
- $$.updateTargets($$.data.targets); // this is needed when transforming to arc
- $$.updateAndRedraw(options);
- };
+ if ($$.isTimeSeries()) {
+ value = $$.parseDate(d.value);
+ } else if ($$.isCategorized() && typeof d.value === 'string') {
+ value = $$.config.axis_x_categories.indexOf(d.value);
+ }
- Chart.prototype.x = function (x) {
- var $$ = this.internal;
- if (arguments.length) {
- $$.updateTargetX($$.data.targets, x);
- $$.redraw({ withUpdateOrgXDomain: true, withUpdateXDomain: true });
- }
- return $$.data.xs;
- };
- Chart.prototype.xs = function (xs) {
- var $$ = this.internal;
- if (arguments.length) {
- $$.updateTargetXs($$.data.targets, xs);
- $$.redraw({ withUpdateOrgXDomain: true, withUpdateXDomain: true });
- }
- return $$.data.xs;
- };
+ return Math.ceil($$.x(value));
+ };
- Chart.prototype.zoom = function (domain) {
- var $$ = this.internal;
- if (domain) {
- if ($$.isTimeSeries()) {
- domain = domain.map(function (x) {
- return $$.parseDate(x);
- });
- }
- if ($$.config.subchart_show) {
- $$.brush.selectionAsValue(domain, true);
- } else {
- $$.updateXDomain(null, true, false, false, domain);
- $$.redraw({ withY: $$.config.zoom_rescale, withSubchart: false });
- }
- $$.config.zoom_onzoom.call(this, $$.x.orgDomain());
- return domain;
- } else {
- return $$.x.domain();
- }
- };
- Chart.prototype.zoom.enable = function (enabled) {
- var $$ = this.internal;
- $$.config.zoom_enabled = enabled;
- $$.updateAndRedraw();
- };
- Chart.prototype.unzoom = function () {
- var $$ = this.internal;
- if ($$.config.subchart_show) {
- $$.brush.clear();
- } else {
- $$.updateXDomain(null, true, false, false, $$.subX.domain());
- $$.redraw({ withY: $$.config.zoom_rescale, withSubchart: false });
- }
- };
+ ChartInternal.prototype.yv = function (d) {
+ var $$ = this,
+ yScale = d.axis && d.axis === 'y2' ? $$.y2 : $$.y;
+ return Math.ceil(yScale(d.value));
+ };
- Chart.prototype.zoom.max = function (max) {
- var $$ = this.internal,
- config = $$.config,
- d3 = $$.d3;
- if (max === 0 || max) {
- config.zoom_x_max = d3.max([$$.orgXDomain[1], max]);
- } else {
- return config.zoom_x_max;
- }
- };
+ ChartInternal.prototype.subxx = function (d) {
+ return d ? this.subX(d.x) : null;
+ };
- Chart.prototype.zoom.min = function (min) {
- var $$ = this.internal,
- config = $$.config,
- d3 = $$.d3;
- if (min === 0 || min) {
- config.zoom_x_min = d3.min([$$.orgXDomain[0], min]);
- } else {
- return config.zoom_x_min;
- }
- };
+ ChartInternal.prototype.transformMain = function (withTransition, transitions) {
+ var $$ = this,
+ xAxis,
+ yAxis,
+ y2Axis;
- Chart.prototype.zoom.range = function (range) {
- if (arguments.length) {
- if (isDefined(range.max)) {
- this.domain.max(range.max);
- }
- if (isDefined(range.min)) {
- this.domain.min(range.min);
- }
- } else {
- return {
- max: this.domain.max(),
- min: this.domain.min()
- };
- }
- };
+ if (transitions && transitions.axisX) {
+ xAxis = transitions.axisX;
+ } else {
+ xAxis = $$.main.select('.' + CLASS.axisX);
- ChartInternal.prototype.initPie = function () {
- var $$ = this,
- d3 = $$.d3;
- $$.pie = d3.pie().value(function (d) {
- return d.values.reduce(function (a, b) {
- return a + b.value;
- }, 0);
- });
+ if (withTransition) {
+ xAxis = xAxis.transition();
+ }
+ }
- var orderFct = $$.getOrderFunction();
+ if (transitions && transitions.axisY) {
+ yAxis = transitions.axisY;
+ } else {
+ yAxis = $$.main.select('.' + CLASS.axisY);
- // we need to reverse the returned order if asc or desc to have the slice in expected order.
- if (orderFct && ($$.isOrderAsc() || $$.isOrderDesc())) {
- var defaultSort = orderFct;
- orderFct = function orderFct(t1, t2) {
- return defaultSort(t1, t2) * -1;
- };
- }
+ if (withTransition) {
+ yAxis = yAxis.transition();
+ }
+ }
- $$.pie.sort(orderFct || null);
- };
+ if (transitions && transitions.axisY2) {
+ y2Axis = transitions.axisY2;
+ } else {
+ y2Axis = $$.main.select('.' + CLASS.axisY2);
- ChartInternal.prototype.updateRadius = function () {
- var $$ = this,
- config = $$.config,
- w = config.gauge_width || config.donut_width,
- gaugeArcWidth = $$.filterTargetsToShow($$.data.targets).length * $$.config.gauge_arcs_minWidth;
- $$.radiusExpanded = Math.min($$.arcWidth, $$.arcHeight) / 2 * ($$.hasType('gauge') ? 0.85 : 1);
- $$.radius = $$.radiusExpanded * 0.95;
- $$.innerRadiusRatio = w ? ($$.radius - w) / $$.radius : 0.6;
- $$.innerRadius = $$.hasType('donut') || $$.hasType('gauge') ? $$.radius * $$.innerRadiusRatio : 0;
- $$.gaugeArcWidth = w ? w : gaugeArcWidth <= $$.radius - $$.innerRadius ? $$.radius - $$.innerRadius : gaugeArcWidth <= $$.radius ? gaugeArcWidth : $$.radius;
- };
+ if (withTransition) {
+ y2Axis = y2Axis.transition();
+ }
+ }
- ChartInternal.prototype.updateArc = function () {
- var $$ = this;
- $$.svgArc = $$.getSvgArc();
- $$.svgArcExpanded = $$.getSvgArcExpanded();
- $$.svgArcExpandedSub = $$.getSvgArcExpanded(0.98);
- };
+ (withTransition ? $$.main.transition() : $$.main).attr("transform", $$.getTranslate('main'));
+ xAxis.attr("transform", $$.getTranslate('x'));
+ yAxis.attr("transform", $$.getTranslate('y'));
+ y2Axis.attr("transform", $$.getTranslate('y2'));
+ $$.main.select('.' + CLASS.chartArcs).attr("transform", $$.getTranslate('arc'));
+ };
- ChartInternal.prototype.updateAngle = function (d) {
- var $$ = this,
- config = $$.config,
- found = false,
- index = 0,
- gMin,
- gMax,
- gTic,
- gValue;
-
- if (!config) {
- return null;
- }
+ ChartInternal.prototype.transformAll = function (withTransition, transitions) {
+ var $$ = this;
+ $$.transformMain(withTransition, transitions);
- $$.pie($$.filterTargetsToShow($$.data.targets)).forEach(function (t) {
- if (!found && t.data.id === d.data.id) {
- found = true;
- d = t;
- d.index = index;
- }
- index++;
- });
- if (isNaN(d.startAngle)) {
- d.startAngle = 0;
- }
- if (isNaN(d.endAngle)) {
- d.endAngle = d.startAngle;
- }
- if ($$.isGaugeType(d.data)) {
- gMin = config.gauge_min;
- gMax = config.gauge_max;
- gTic = Math.PI * (config.gauge_fullCircle ? 2 : 1) / (gMax - gMin);
- gValue = d.value < gMin ? 0 : d.value < gMax ? d.value - gMin : gMax - gMin;
- d.startAngle = config.gauge_startingAngle;
- d.endAngle = d.startAngle + gTic * gValue;
- }
- return found ? d : null;
- };
+ if ($$.config.subchart_show) {
+ $$.transformContext(withTransition, transitions);
+ }
- ChartInternal.prototype.getSvgArc = function () {
- var $$ = this,
- hasGaugeType = $$.hasType('gauge'),
- singleArcWidth = $$.gaugeArcWidth / $$.filterTargetsToShow($$.data.targets).length,
- arc = $$.d3.arc().outerRadius(function (d) {
- return hasGaugeType ? $$.radius - singleArcWidth * d.index : $$.radius;
- }).innerRadius(function (d) {
- return hasGaugeType ? $$.radius - singleArcWidth * (d.index + 1) : $$.innerRadius;
- }),
- newArc = function newArc(d, withoutUpdate) {
- var updated;
- if (withoutUpdate) {
- return arc(d);
- } // for interpolate
- updated = $$.updateAngle(d);
- return updated ? arc(updated) : "M 0 0";
- };
- // TODO: extends all function
- newArc.centroid = arc.centroid;
- return newArc;
- };
+ if ($$.legend) {
+ $$.transformLegend(withTransition);
+ }
+ };
+
+ ChartInternal.prototype.updateSvgSize = function () {
+ var $$ = this,
+ brush = $$.svg.select(".c3-brush .overlay");
+ $$.svg.attr('width', $$.currentWidth).attr('height', $$.currentHeight);
+ $$.svg.selectAll(['#' + $$.clipId, '#' + $$.clipIdForGrid]).select('rect').attr('width', $$.width).attr('height', $$.height);
+ $$.svg.select('#' + $$.clipIdForXAxis).select('rect').attr('x', $$.getXAxisClipX.bind($$)).attr('y', $$.getXAxisClipY.bind($$)).attr('width', $$.getXAxisClipWidth.bind($$)).attr('height', $$.getXAxisClipHeight.bind($$));
+ $$.svg.select('#' + $$.clipIdForYAxis).select('rect').attr('x', $$.getYAxisClipX.bind($$)).attr('y', $$.getYAxisClipY.bind($$)).attr('width', $$.getYAxisClipWidth.bind($$)).attr('height', $$.getYAxisClipHeight.bind($$));
+ $$.svg.select('#' + $$.clipIdForSubchart).select('rect').attr('width', $$.width).attr('height', brush.size() ? brush.attr('height') : 0); // MEMO: parent div's height will be bigger than svg when <!DOCTYPE html>
+
+ $$.selectChart.style('max-height', $$.currentHeight + "px");
+ };
+
+ ChartInternal.prototype.updateDimension = function (withoutAxis) {
+ var $$ = this;
+
+ if (!withoutAxis) {
+ if ($$.config.axis_rotated) {
+ $$.axes.x.call($$.xAxis);
+ $$.axes.subx.call($$.subXAxis);
+ } else {
+ $$.axes.y.call($$.yAxis);
+ $$.axes.y2.call($$.y2Axis);
+ }
+ }
- ChartInternal.prototype.getSvgArcExpanded = function (rate) {
- rate = rate || 1;
- var $$ = this,
- hasGaugeType = $$.hasType('gauge'),
- singleArcWidth = $$.gaugeArcWidth / $$.filterTargetsToShow($$.data.targets).length,
- expandWidth = Math.min($$.radiusExpanded * rate - $$.radius, singleArcWidth * 0.8 - (1 - rate) * 100),
- arc = $$.d3.arc().outerRadius(function (d) {
- return hasGaugeType ? $$.radius - singleArcWidth * d.index + expandWidth : $$.radiusExpanded * rate;
- }).innerRadius(function (d) {
- return hasGaugeType ? $$.radius - singleArcWidth * (d.index + 1) : $$.innerRadius;
- });
- return function (d) {
- var updated = $$.updateAngle(d);
- return updated ? arc(updated) : "M 0 0";
- };
- };
+ $$.updateSizes();
+ $$.updateScales();
+ $$.updateSvgSize();
+ $$.transformAll(false);
+ };
- ChartInternal.prototype.getArc = function (d, withoutUpdate, force) {
- return force || this.isArcType(d.data) ? this.svgArc(d, withoutUpdate) : "M 0 0";
- };
+ ChartInternal.prototype.observeInserted = function (selection) {
+ var $$ = this,
+ observer;
- ChartInternal.prototype.transformForArcLabel = function (d) {
- var $$ = this,
- config = $$.config,
- updated = $$.updateAngle(d),
- c,
- x,
- y,
- h,
- ratio,
- translate = "",
- hasGauge = $$.hasType('gauge');
- if (updated && !hasGauge) {
- c = this.svgArc.centroid(updated);
- x = isNaN(c[0]) ? 0 : c[0];
- y = isNaN(c[1]) ? 0 : c[1];
- h = Math.sqrt(x * x + y * y);
- if ($$.hasType('donut') && config.donut_label_ratio) {
- ratio = isFunction(config.donut_label_ratio) ? config.donut_label_ratio(d, $$.radius, h) : config.donut_label_ratio;
- } else if ($$.hasType('pie') && config.pie_label_ratio) {
- ratio = isFunction(config.pie_label_ratio) ? config.pie_label_ratio(d, $$.radius, h) : config.pie_label_ratio;
- } else {
- ratio = $$.radius && h ? (36 / $$.radius > 0.375 ? 1.175 - 36 / $$.radius : 0.8) * $$.radius / h : 0;
- }
- translate = "translate(" + x * ratio + ',' + y * ratio + ")";
- } else if (updated && hasGauge && $$.filterTargetsToShow($$.data.targets).length > 1) {
- var y1 = Math.sin(updated.endAngle - Math.PI / 2);
- x = Math.cos(updated.endAngle - Math.PI / 2) * ($$.radiusExpanded + 25);
- y = y1 * ($$.radiusExpanded + 15 - Math.abs(y1 * 10)) + 3;
- translate = "translate(" + x + ',' + y + ")";
- }
- return translate;
- };
+ if (typeof MutationObserver === 'undefined') {
+ window.console.error("MutationObserver not defined.");
+ return;
+ }
- ChartInternal.prototype.getArcRatio = function (d) {
- var $$ = this,
- config = $$.config,
- whole = Math.PI * ($$.hasType('gauge') && !config.gauge_fullCircle ? 1 : 2);
- return d ? (d.endAngle - d.startAngle) / whole : null;
- };
+ observer = new MutationObserver(function (mutations) {
+ mutations.forEach(function (mutation) {
+ if (mutation.type === 'childList' && mutation.previousSibling) {
+ observer.disconnect(); // need to wait for completion of load because size calculation requires the actual sizes determined after that completion
- ChartInternal.prototype.convertToArcData = function (d) {
- return this.addName({
- id: d.data.id,
- value: d.value,
- ratio: this.getArcRatio(d),
- index: d.index
- });
- };
+ $$.intervalForObserveInserted = window.setInterval(function () {
+ // parentNode will NOT be null when completed
+ if (selection.node().parentNode) {
+ window.clearInterval($$.intervalForObserveInserted);
+ $$.updateDimension();
- ChartInternal.prototype.textForArcLabel = function (d) {
- var $$ = this,
- updated,
- value,
- ratio,
- id,
- format;
- if (!$$.shouldShowArcLabel()) {
- return "";
- }
- updated = $$.updateAngle(d);
- value = updated ? updated.value : null;
- ratio = $$.getArcRatio(updated);
- id = d.data.id;
- if (!$$.hasType('gauge') && !$$.meetsArcLabelThreshold(ratio)) {
- return "";
+ if ($$.brush) {
+ $$.brush.update();
+ }
+
+ $$.config.oninit.call($$);
+ $$.redraw({
+ withTransform: true,
+ withUpdateXDomain: true,
+ withUpdateOrgXDomain: true,
+ withTransition: false,
+ withTransitionForTransform: false,
+ withLegend: true
+ });
+ selection.transition().style('opacity', 1);
+ }
+ }, 10);
+ }
+ });
+ });
+ observer.observe(selection.node(), {
+ attributes: true,
+ childList: true,
+ characterData: true
+ });
+ };
+ /**
+ * Binds handlers to the window resize event.
+ */
+
+
+ ChartInternal.prototype.bindResize = function () {
+ var $$ = this,
+ config = $$.config;
+ $$.resizeFunction = $$.generateResize(); // need to call .remove
+
+ $$.resizeFunction.add(function () {
+ config.onresize.call($$);
+ });
+
+ if (config.resize_auto) {
+ $$.resizeFunction.add(function () {
+ if ($$.resizeTimeout !== undefined) {
+ window.clearTimeout($$.resizeTimeout);
}
- format = $$.getArcLabelFormat();
- return format ? format(value, ratio, id) : $$.defaultArcValueFormat(value, ratio);
- };
- ChartInternal.prototype.textForGaugeMinMax = function (value, isMax) {
- var $$ = this,
- format = $$.getGaugeLabelExtents();
+ $$.resizeTimeout = window.setTimeout(function () {
+ delete $$.resizeTimeout;
+ $$.updateAndRedraw({
+ withUpdateXDomain: false,
+ withUpdateOrgXDomain: false,
+ withTransition: false,
+ withTransitionForTransform: false,
+ withLegend: true
+ });
- return format ? format(value, isMax) : value;
- };
+ if ($$.brush) {
+ $$.brush.update();
+ }
+ }, 100);
+ });
+ }
- ChartInternal.prototype.expandArc = function (targetIds) {
- var $$ = this,
- interval;
-
- // MEMO: avoid to cancel transition
- if ($$.transiting) {
- interval = window.setInterval(function () {
- if (!$$.transiting) {
- window.clearInterval(interval);
- if ($$.legend.selectAll('.c3-legend-item-focused').size() > 0) {
- $$.expandArc(targetIds);
- }
- }
- }, 10);
- return;
- }
+ $$.resizeFunction.add(function () {
+ config.onresized.call($$);
+ });
- targetIds = $$.mapToTargetIds(targetIds);
+ $$.resizeIfElementDisplayed = function () {
+ // if element not displayed skip it
+ if ($$.api == null || !$$.api.element.offsetParent) {
+ return;
+ }
- $$.svg.selectAll($$.selectorTargets(targetIds, '.' + CLASS.chartArc)).each(function (d) {
- if (!$$.shouldExpand(d.data.id)) {
- return;
- }
- $$.d3.select(this).selectAll('path').transition().duration($$.expandDuration(d.data.id)).attr("d", $$.svgArcExpanded).transition().duration($$.expandDuration(d.data.id) * 2).attr("d", $$.svgArcExpandedSub).each(function (d) {
- if ($$.isDonutType(d.data)) ;
- });
- });
+ $$.resizeFunction();
};
- ChartInternal.prototype.unexpandArc = function (targetIds) {
- var $$ = this;
+ if (window.attachEvent) {
+ window.attachEvent('onresize', $$.resizeIfElementDisplayed);
+ } else if (window.addEventListener) {
+ window.addEventListener('resize', $$.resizeIfElementDisplayed, false);
+ } else {
+ // fallback to this, if this is a very old browser
+ var wrapper = window.onresize;
- if ($$.transiting) {
- return;
+ if (!wrapper) {
+ // create a wrapper that will call all charts
+ wrapper = $$.generateResize();
+ } else if (!wrapper.add || !wrapper.remove) {
+ // there is already a handler registered, make sure we call it too
+ wrapper = $$.generateResize();
+ wrapper.add(window.onresize);
+ } // add this graph to the wrapper, we will be removed if the user calls destroy
+
+
+ wrapper.add($$.resizeFunction);
+
+ window.onresize = function () {
+ // if element not displayed skip it
+ if (!$$.api.element.offsetParent) {
+ return;
}
- targetIds = $$.mapToTargetIds(targetIds);
+ wrapper();
+ };
+ }
+ };
+ /**
+ * Binds handlers to the window focus event.
+ */
- $$.svg.selectAll($$.selectorTargets(targetIds, '.' + CLASS.chartArc)).selectAll('path').transition().duration(function (d) {
- return $$.expandDuration(d.data.id);
- }).attr("d", $$.svgArc);
- $$.svg.selectAll('.' + CLASS.arc);
- };
- ChartInternal.prototype.expandDuration = function (id) {
- var $$ = this,
- config = $$.config;
+ ChartInternal.prototype.bindWindowFocus = function () {
+ var _this = this;
- if ($$.isDonutType(id)) {
- return config.donut_expand_duration;
- } else if ($$.isGaugeType(id)) {
- return config.gauge_expand_duration;
- } else if ($$.isPieType(id)) {
- return config.pie_expand_duration;
- } else {
- return 50;
- }
- };
+ if (this.windowFocusHandler) {
+ // The handler is already set
+ return;
+ }
- ChartInternal.prototype.shouldExpand = function (id) {
- var $$ = this,
- config = $$.config;
- return $$.isDonutType(id) && config.donut_expand || $$.isGaugeType(id) && config.gauge_expand || $$.isPieType(id) && config.pie_expand;
+ this.windowFocusHandler = function () {
+ _this.redraw();
};
- ChartInternal.prototype.shouldShowArcLabel = function () {
- var $$ = this,
- config = $$.config,
- shouldShow = true;
- if ($$.hasType('donut')) {
- shouldShow = config.donut_label_show;
- } else if ($$.hasType('pie')) {
- shouldShow = config.pie_label_show;
- }
- // when gauge, always true
- return shouldShow;
- };
+ window.addEventListener('focus', this.windowFocusHandler);
+ };
+ /**
+ * Unbinds from the window focus event.
+ */
+
+
+ ChartInternal.prototype.unbindWindowFocus = function () {
+ window.removeEventListener('focus', this.windowFocusHandler);
+ delete this.windowFocusHandler;
+ };
+
+ ChartInternal.prototype.generateResize = function () {
+ var resizeFunctions = [];
+
+ function callResizeFunctions() {
+ resizeFunctions.forEach(function (f) {
+ f();
+ });
+ }
- ChartInternal.prototype.meetsArcLabelThreshold = function (ratio) {
- var $$ = this,
- config = $$.config,
- threshold = $$.hasType('donut') ? config.donut_label_threshold : config.pie_label_threshold;
- return ratio >= threshold;
+ callResizeFunctions.add = function (f) {
+ resizeFunctions.push(f);
};
- ChartInternal.prototype.getArcLabelFormat = function () {
- var $$ = this,
- config = $$.config,
- format = config.pie_label_format;
- if ($$.hasType('gauge')) {
- format = config.gauge_label_format;
- } else if ($$.hasType('donut')) {
- format = config.donut_label_format;
+ callResizeFunctions.remove = function (f) {
+ for (var i = 0; i < resizeFunctions.length; i++) {
+ if (resizeFunctions[i] === f) {
+ resizeFunctions.splice(i, 1);
+ break;
}
- return format;
+ }
};
- ChartInternal.prototype.getGaugeLabelExtents = function () {
- var $$ = this,
- config = $$.config;
- return config.gauge_label_extents;
- };
+ return callResizeFunctions;
+ };
- ChartInternal.prototype.getArcTitle = function () {
- var $$ = this;
- return $$.hasType('donut') ? $$.config.donut_title : "";
- };
+ ChartInternal.prototype.endall = function (transition, callback) {
+ var n = 0;
+ transition.each(function () {
+ ++n;
+ }).on("end", function () {
+ if (! --n) {
+ callback.apply(this, arguments);
+ }
+ });
+ };
+
+ ChartInternal.prototype.generateWait = function () {
+ var transitionsToWait = [],
+ f = function f(callback) {
+ var timer = setInterval(function () {
+ var done = 0;
+ transitionsToWait.forEach(function (t) {
+ if (t.empty()) {
+ done += 1;
+ return;
+ }
- ChartInternal.prototype.updateTargetsForArc = function (targets) {
- var $$ = this,
- main = $$.main,
- mainPies,
- mainPieEnter,
- classChartArc = $$.classChartArc.bind($$),
- classArcs = $$.classArcs.bind($$),
- classFocus = $$.classFocus.bind($$);
- mainPies = main.select('.' + CLASS.chartArcs).selectAll('.' + CLASS.chartArc).data($$.pie(targets)).attr("class", function (d) {
- return classChartArc(d) + classFocus(d.data);
+ try {
+ t.transition();
+ } catch (e) {
+ done += 1;
+ }
});
- mainPieEnter = mainPies.enter().append("g").attr("class", classChartArc);
- mainPieEnter.append('g').attr('class', classArcs);
- mainPieEnter.append("text").attr("dy", $$.hasType('gauge') ? "-.1em" : ".35em").style("opacity", 0).style("text-anchor", "middle").style("pointer-events", "none");
- // MEMO: can not keep same color..., but not bad to update color in redraw
- //mainPieUpdate.exit().remove();
+
+ if (done === transitionsToWait.length) {
+ clearInterval(timer);
+
+ if (callback) {
+ callback();
+ }
+ }
+ }, 50);
};
- ChartInternal.prototype.initArc = function () {
- var $$ = this;
- $$.arcs = $$.main.select('.' + CLASS.chart).append("g").attr("class", CLASS.chartArcs).attr("transform", $$.getTranslate('arc'));
- $$.arcs.append('text').attr('class', CLASS.chartArcsTitle).style("text-anchor", "middle").text($$.getArcTitle());
+ f.add = function (transition) {
+ transitionsToWait.push(transition);
};
- ChartInternal.prototype.redrawArc = function (duration, durationForExit, withTransform) {
- var $$ = this,
- d3 = $$.d3,
- config = $$.config,
- main = $$.main,
- arcs,
- mainArc,
- arcLabelLines,
- mainArcLabelLine,
- hasGaugeType = $$.hasType('gauge');
- arcs = main.selectAll('.' + CLASS.arcs).selectAll('.' + CLASS.arc).data($$.arcData.bind($$));
- mainArc = arcs.enter().append('path').attr("class", $$.classArc.bind($$)).style("fill", function (d) {
- return $$.color(d.data);
- }).style("cursor", function (d) {
- return config.interaction_enabled && config.data_selection_isselectable(d) ? "pointer" : null;
- }).each(function (d) {
- if ($$.isGaugeType(d.data)) {
- d.startAngle = d.endAngle = config.gauge_startingAngle;
+ return f;
+ };
+
+ ChartInternal.prototype.parseDate = function (date) {
+ var $$ = this,
+ parsedDate;
+
+ if (date instanceof Date) {
+ parsedDate = date;
+ } else if (typeof date === 'string') {
+ parsedDate = $$.dataTimeParse(date);
+ } else if (_typeof(date) === 'object') {
+ parsedDate = new Date(+date);
+ } else if (typeof date === 'number' && !isNaN(date)) {
+ parsedDate = new Date(+date);
+ }
+
+ if (!parsedDate || isNaN(+parsedDate)) {
+ window.console.error("Failed to parse x '" + date + "' to Date object");
+ }
+
+ return parsedDate;
+ };
+
+ ChartInternal.prototype.isTabVisible = function () {
+ return !document.hidden;
+ };
+
+ ChartInternal.prototype.getPathBox = getPathBox;
+ ChartInternal.prototype.CLASS = CLASS;
+
+ /* jshint ignore:start */
+ // SVGPathSeg API polyfill
+ // https://github.com/progers/pathseg
+ //
+ // This is a drop-in replacement for the SVGPathSeg and SVGPathSegList APIs that were removed from
+ // SVG2 (https://lists.w3.org/Archives/Public/www-svg/2015Jun/0044.html), including the latest spec
+ // changes which were implemented in Firefox 43 and Chrome 46.
+ (function () {
+
+ if (!("SVGPathSeg" in window)) {
+ // Spec: http://www.w3.org/TR/SVG11/single-page.html#paths-InterfaceSVGPathSeg
+ window.SVGPathSeg = function (type, typeAsLetter, owningPathSegList) {
+ this.pathSegType = type;
+ this.pathSegTypeAsLetter = typeAsLetter;
+ this._owningPathSegList = owningPathSegList;
+ };
+
+ window.SVGPathSeg.prototype.classname = "SVGPathSeg";
+ window.SVGPathSeg.PATHSEG_UNKNOWN = 0;
+ window.SVGPathSeg.PATHSEG_CLOSEPATH = 1;
+ window.SVGPathSeg.PATHSEG_MOVETO_ABS = 2;
+ window.SVGPathSeg.PATHSEG_MOVETO_REL = 3;
+ window.SVGPathSeg.PATHSEG_LINETO_ABS = 4;
+ window.SVGPathSeg.PATHSEG_LINETO_REL = 5;
+ window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS = 6;
+ window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL = 7;
+ window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS = 8;
+ window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL = 9;
+ window.SVGPathSeg.PATHSEG_ARC_ABS = 10;
+ window.SVGPathSeg.PATHSEG_ARC_REL = 11;
+ window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS = 12;
+ window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL = 13;
+ window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS = 14;
+ window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL = 15;
+ window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS = 16;
+ window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL = 17;
+ window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_ABS = 18;
+ window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_SMOOTH_REL = 19; // Notify owning PathSegList on any changes so they can be synchronized back to the path element.
+
+ window.SVGPathSeg.prototype._segmentChanged = function () {
+ if (this._owningPathSegList) this._owningPathSegList.segmentChanged(this);
+ };
+
+ window.SVGPathSegClosePath = function (owningPathSegList) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CLOSEPATH, "z", owningPathSegList);
+ };
+
+ window.SVGPathSegClosePath.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegClosePath.prototype.toString = function () {
+ return "[object SVGPathSegClosePath]";
+ };
+
+ window.SVGPathSegClosePath.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter;
+ };
+
+ window.SVGPathSegClosePath.prototype.clone = function () {
+ return new window.SVGPathSegClosePath(undefined);
+ };
+
+ window.SVGPathSegMovetoAbs = function (owningPathSegList, x, y) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_MOVETO_ABS, "M", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ };
+
+ window.SVGPathSegMovetoAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegMovetoAbs.prototype.toString = function () {
+ return "[object SVGPathSegMovetoAbs]";
+ };
+
+ window.SVGPathSegMovetoAbs.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegMovetoAbs.prototype.clone = function () {
+ return new window.SVGPathSegMovetoAbs(undefined, this._x, this._y);
+ };
+
+ Object.defineProperty(window.SVGPathSegMovetoAbs.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegMovetoAbs.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegMovetoRel = function (owningPathSegList, x, y) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_MOVETO_REL, "m", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ };
+
+ window.SVGPathSegMovetoRel.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegMovetoRel.prototype.toString = function () {
+ return "[object SVGPathSegMovetoRel]";
+ };
+
+ window.SVGPathSegMovetoRel.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegMovetoRel.prototype.clone = function () {
+ return new window.SVGPathSegMovetoRel(undefined, this._x, this._y);
+ };
+
+ Object.defineProperty(window.SVGPathSegMovetoRel.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegMovetoRel.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegLinetoAbs = function (owningPathSegList, x, y) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_ABS, "L", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ };
+
+ window.SVGPathSegLinetoAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegLinetoAbs.prototype.toString = function () {
+ return "[object SVGPathSegLinetoAbs]";
+ };
+
+ window.SVGPathSegLinetoAbs.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegLinetoAbs.prototype.clone = function () {
+ return new window.SVGPathSegLinetoAbs(undefined, this._x, this._y);
+ };
+
+ Object.defineProperty(window.SVGPathSegLinetoAbs.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegLinetoAbs.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegLinetoRel = function (owningPathSegList, x, y) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_REL, "l", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ };
+
+ window.SVGPathSegLinetoRel.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegLinetoRel.prototype.toString = function () {
+ return "[object SVGPathSegLinetoRel]";
+ };
+
+ window.SVGPathSegLinetoRel.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegLinetoRel.prototype.clone = function () {
+ return new window.SVGPathSegLinetoRel(undefined, this._x, this._y);
+ };
+
+ Object.defineProperty(window.SVGPathSegLinetoRel.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegLinetoRel.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegCurvetoCubicAbs = function (owningPathSegList, x, y, x1, y1, x2, y2) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_ABS, "C", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ this._x1 = x1;
+ this._y1 = y1;
+ this._x2 = x2;
+ this._y2 = y2;
+ };
+
+ window.SVGPathSegCurvetoCubicAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegCurvetoCubicAbs.prototype.toString = function () {
+ return "[object SVGPathSegCurvetoCubicAbs]";
+ };
+
+ window.SVGPathSegCurvetoCubicAbs.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x1 + " " + this._y1 + " " + this._x2 + " " + this._y2 + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegCurvetoCubicAbs.prototype.clone = function () {
+ return new window.SVGPathSegCurvetoCubicAbs(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2);
+ };
+
+ Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "x1", {
+ get: function get() {
+ return this._x1;
+ },
+ set: function set(x1) {
+ this._x1 = x1;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "y1", {
+ get: function get() {
+ return this._y1;
+ },
+ set: function set(y1) {
+ this._y1 = y1;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "x2", {
+ get: function get() {
+ return this._x2;
+ },
+ set: function set(x2) {
+ this._x2 = x2;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicAbs.prototype, "y2", {
+ get: function get() {
+ return this._y2;
+ },
+ set: function set(y2) {
+ this._y2 = y2;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegCurvetoCubicRel = function (owningPathSegList, x, y, x1, y1, x2, y2) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_REL, "c", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ this._x1 = x1;
+ this._y1 = y1;
+ this._x2 = x2;
+ this._y2 = y2;
+ };
+
+ window.SVGPathSegCurvetoCubicRel.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegCurvetoCubicRel.prototype.toString = function () {
+ return "[object SVGPathSegCurvetoCubicRel]";
+ };
+
+ window.SVGPathSegCurvetoCubicRel.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x1 + " " + this._y1 + " " + this._x2 + " " + this._y2 + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegCurvetoCubicRel.prototype.clone = function () {
+ return new window.SVGPathSegCurvetoCubicRel(undefined, this._x, this._y, this._x1, this._y1, this._x2, this._y2);
+ };
+
+ Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "x1", {
+ get: function get() {
+ return this._x1;
+ },
+ set: function set(x1) {
+ this._x1 = x1;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "y1", {
+ get: function get() {
+ return this._y1;
+ },
+ set: function set(y1) {
+ this._y1 = y1;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "x2", {
+ get: function get() {
+ return this._x2;
+ },
+ set: function set(x2) {
+ this._x2 = x2;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicRel.prototype, "y2", {
+ get: function get() {
+ return this._y2;
+ },
+ set: function set(y2) {
+ this._y2 = y2;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegCurvetoQuadraticAbs = function (owningPathSegList, x, y, x1, y1) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_ABS, "Q", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ this._x1 = x1;
+ this._y1 = y1;
+ };
+
+ window.SVGPathSegCurvetoQuadraticAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegCurvetoQuadraticAbs.prototype.toString = function () {
+ return "[object SVGPathSegCurvetoQuadraticAbs]";
+ };
+
+ window.SVGPathSegCurvetoQuadraticAbs.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x1 + " " + this._y1 + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegCurvetoQuadraticAbs.prototype.clone = function () {
+ return new window.SVGPathSegCurvetoQuadraticAbs(undefined, this._x, this._y, this._x1, this._y1);
+ };
+
+ Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, "x1", {
+ get: function get() {
+ return this._x1;
+ },
+ set: function set(x1) {
+ this._x1 = x1;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoQuadraticAbs.prototype, "y1", {
+ get: function get() {
+ return this._y1;
+ },
+ set: function set(y1) {
+ this._y1 = y1;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegCurvetoQuadraticRel = function (owningPathSegList, x, y, x1, y1) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_QUADRATIC_REL, "q", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ this._x1 = x1;
+ this._y1 = y1;
+ };
+
+ window.SVGPathSegCurvetoQuadraticRel.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegCurvetoQuadraticRel.prototype.toString = function () {
+ return "[object SVGPathSegCurvetoQuadraticRel]";
+ };
+
+ window.SVGPathSegCurvetoQuadraticRel.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x1 + " " + this._y1 + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegCurvetoQuadraticRel.prototype.clone = function () {
+ return new window.SVGPathSegCurvetoQuadraticRel(undefined, this._x, this._y, this._x1, this._y1);
+ };
+
+ Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, "x1", {
+ get: function get() {
+ return this._x1;
+ },
+ set: function set(x1) {
+ this._x1 = x1;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoQuadraticRel.prototype, "y1", {
+ get: function get() {
+ return this._y1;
+ },
+ set: function set(y1) {
+ this._y1 = y1;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegArcAbs = function (owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_ARC_ABS, "A", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ this._r1 = r1;
+ this._r2 = r2;
+ this._angle = angle;
+ this._largeArcFlag = largeArcFlag;
+ this._sweepFlag = sweepFlag;
+ };
+
+ window.SVGPathSegArcAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegArcAbs.prototype.toString = function () {
+ return "[object SVGPathSegArcAbs]";
+ };
+
+ window.SVGPathSegArcAbs.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._r1 + " " + this._r2 + " " + this._angle + " " + (this._largeArcFlag ? "1" : "0") + " " + (this._sweepFlag ? "1" : "0") + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegArcAbs.prototype.clone = function () {
+ return new window.SVGPathSegArcAbs(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag);
+ };
+
+ Object.defineProperty(window.SVGPathSegArcAbs.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcAbs.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcAbs.prototype, "r1", {
+ get: function get() {
+ return this._r1;
+ },
+ set: function set(r1) {
+ this._r1 = r1;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcAbs.prototype, "r2", {
+ get: function get() {
+ return this._r2;
+ },
+ set: function set(r2) {
+ this._r2 = r2;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcAbs.prototype, "angle", {
+ get: function get() {
+ return this._angle;
+ },
+ set: function set(angle) {
+ this._angle = angle;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcAbs.prototype, "largeArcFlag", {
+ get: function get() {
+ return this._largeArcFlag;
+ },
+ set: function set(largeArcFlag) {
+ this._largeArcFlag = largeArcFlag;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcAbs.prototype, "sweepFlag", {
+ get: function get() {
+ return this._sweepFlag;
+ },
+ set: function set(sweepFlag) {
+ this._sweepFlag = sweepFlag;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegArcRel = function (owningPathSegList, x, y, r1, r2, angle, largeArcFlag, sweepFlag) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_ARC_REL, "a", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ this._r1 = r1;
+ this._r2 = r2;
+ this._angle = angle;
+ this._largeArcFlag = largeArcFlag;
+ this._sweepFlag = sweepFlag;
+ };
+
+ window.SVGPathSegArcRel.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegArcRel.prototype.toString = function () {
+ return "[object SVGPathSegArcRel]";
+ };
+
+ window.SVGPathSegArcRel.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._r1 + " " + this._r2 + " " + this._angle + " " + (this._largeArcFlag ? "1" : "0") + " " + (this._sweepFlag ? "1" : "0") + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegArcRel.prototype.clone = function () {
+ return new window.SVGPathSegArcRel(undefined, this._x, this._y, this._r1, this._r2, this._angle, this._largeArcFlag, this._sweepFlag);
+ };
+
+ Object.defineProperty(window.SVGPathSegArcRel.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcRel.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcRel.prototype, "r1", {
+ get: function get() {
+ return this._r1;
+ },
+ set: function set(r1) {
+ this._r1 = r1;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcRel.prototype, "r2", {
+ get: function get() {
+ return this._r2;
+ },
+ set: function set(r2) {
+ this._r2 = r2;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcRel.prototype, "angle", {
+ get: function get() {
+ return this._angle;
+ },
+ set: function set(angle) {
+ this._angle = angle;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcRel.prototype, "largeArcFlag", {
+ get: function get() {
+ return this._largeArcFlag;
+ },
+ set: function set(largeArcFlag) {
+ this._largeArcFlag = largeArcFlag;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegArcRel.prototype, "sweepFlag", {
+ get: function get() {
+ return this._sweepFlag;
+ },
+ set: function set(sweepFlag) {
+ this._sweepFlag = sweepFlag;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegLinetoHorizontalAbs = function (owningPathSegList, x) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_ABS, "H", owningPathSegList);
+ this._x = x;
+ };
+
+ window.SVGPathSegLinetoHorizontalAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegLinetoHorizontalAbs.prototype.toString = function () {
+ return "[object SVGPathSegLinetoHorizontalAbs]";
+ };
+
+ window.SVGPathSegLinetoHorizontalAbs.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x;
+ };
+
+ window.SVGPathSegLinetoHorizontalAbs.prototype.clone = function () {
+ return new window.SVGPathSegLinetoHorizontalAbs(undefined, this._x);
+ };
+
+ Object.defineProperty(window.SVGPathSegLinetoHorizontalAbs.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegLinetoHorizontalRel = function (owningPathSegList, x) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_HORIZONTAL_REL, "h", owningPathSegList);
+ this._x = x;
+ };
+
+ window.SVGPathSegLinetoHorizontalRel.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegLinetoHorizontalRel.prototype.toString = function () {
+ return "[object SVGPathSegLinetoHorizontalRel]";
+ };
+
+ window.SVGPathSegLinetoHorizontalRel.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x;
+ };
+
+ window.SVGPathSegLinetoHorizontalRel.prototype.clone = function () {
+ return new window.SVGPathSegLinetoHorizontalRel(undefined, this._x);
+ };
+
+ Object.defineProperty(window.SVGPathSegLinetoHorizontalRel.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegLinetoVerticalAbs = function (owningPathSegList, y) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_ABS, "V", owningPathSegList);
+ this._y = y;
+ };
+
+ window.SVGPathSegLinetoVerticalAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegLinetoVerticalAbs.prototype.toString = function () {
+ return "[object SVGPathSegLinetoVerticalAbs]";
+ };
+
+ window.SVGPathSegLinetoVerticalAbs.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._y;
+ };
+
+ window.SVGPathSegLinetoVerticalAbs.prototype.clone = function () {
+ return new window.SVGPathSegLinetoVerticalAbs(undefined, this._y);
+ };
+
+ Object.defineProperty(window.SVGPathSegLinetoVerticalAbs.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegLinetoVerticalRel = function (owningPathSegList, y) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_LINETO_VERTICAL_REL, "v", owningPathSegList);
+ this._y = y;
+ };
+
+ window.SVGPathSegLinetoVerticalRel.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegLinetoVerticalRel.prototype.toString = function () {
+ return "[object SVGPathSegLinetoVerticalRel]";
+ };
+
+ window.SVGPathSegLinetoVerticalRel.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._y;
+ };
+
+ window.SVGPathSegLinetoVerticalRel.prototype.clone = function () {
+ return new window.SVGPathSegLinetoVerticalRel(undefined, this._y);
+ };
+
+ Object.defineProperty(window.SVGPathSegLinetoVerticalRel.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegCurvetoCubicSmoothAbs = function (owningPathSegList, x, y, x2, y2) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_ABS, "S", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ this._x2 = x2;
+ this._y2 = y2;
+ };
+
+ window.SVGPathSegCurvetoCubicSmoothAbs.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegCurvetoCubicSmoothAbs.prototype.toString = function () {
+ return "[object SVGPathSegCurvetoCubicSmoothAbs]";
+ };
+
+ window.SVGPathSegCurvetoCubicSmoothAbs.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x2 + " " + this._y2 + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegCurvetoCubicSmoothAbs.prototype.clone = function () {
+ return new window.SVGPathSegCurvetoCubicSmoothAbs(undefined, this._x, this._y, this._x2, this._y2);
+ };
+
+ Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, "y", {
+ get: function get() {
+ return this._y;
+ },
+ set: function set(y) {
+ this._y = y;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, "x2", {
+ get: function get() {
+ return this._x2;
+ },
+ set: function set(x2) {
+ this._x2 = x2;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+ Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothAbs.prototype, "y2", {
+ get: function get() {
+ return this._y2;
+ },
+ set: function set(y2) {
+ this._y2 = y2;
+
+ this._segmentChanged();
+ },
+ enumerable: true
+ });
+
+ window.SVGPathSegCurvetoCubicSmoothRel = function (owningPathSegList, x, y, x2, y2) {
+ window.SVGPathSeg.call(this, window.SVGPathSeg.PATHSEG_CURVETO_CUBIC_SMOOTH_REL, "s", owningPathSegList);
+ this._x = x;
+ this._y = y;
+ this._x2 = x2;
+ this._y2 = y2;
+ };
+
+ window.SVGPathSegCurvetoCubicSmoothRel.prototype = Object.create(window.SVGPathSeg.prototype);
+
+ window.SVGPathSegCurvetoCubicSmoothRel.prototype.toString = function () {
+ return "[object SVGPathSegCurvetoCubicSmoothRel]";
+ };
+
+ window.SVGPathSegCurvetoCubicSmoothRel.prototype._asPathString = function () {
+ return this.pathSegTypeAsLetter + " " + this._x2 + " " + this._y2 + " " + this._x + " " + this._y;
+ };
+
+ window.SVGPathSegCurvetoCubicSmoothRel.prototype.clone = function () {
+ return new window.SVGPathSegCurvetoCubicSmoothRel(undefined, this._x, this._y, this._x2, this._y2);
+ };
+
+ Object.defineProperty(window.SVGPathSegCurvetoCubicSmoothRel.prototype, "x", {
+ get: function get() {
+ return this._x;
+ },
+ set: function set(x) {
+ this._x = x;
+
ToastFreeware / chrisu / seepark.git / commitdiff