UNPKG

insight-ui-alterdot

Version:

An open-source frontend for the Insight API. The Insight API provides you with a convenient, powerful and simple way to query and broadcast data on the Alterdot network and build your own services with it.

1,190 lines (1,114 loc) 399 kB
/* @license C3.js v0.4.24 | (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()); }(this, (function () { 'use strict'; 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', 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 _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; }; var classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }; var inherits = function (subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }; var possibleConstructorReturn = function (self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }; var isValue = function isValue(v) { return v || v === 0; }; var isFunction = function isFunction(o) { return typeof o === 'function'; }; var isArray = function isArray(o) { return Array.isArray(o); }; var isString = function isString(o) { return typeof o === 'string'; }; var isUndefined = function isUndefined(v) { return typeof v === 'undefined'; }; var isDefined = function isDefined(v) { return typeof v !== 'undefined'; }; var ceil10 = function ceil10(v) { return Math.ceil(v / 10) * 10; }; var asHalfPixel = function asHalfPixel(n) { return Math.ceil(n) + 0.5; }; var diffDomain = function diffDomain(d) { return d[1] - d[0]; }; 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 notEmpty = function notEmpty(o) { return !c3_chart_internal_fn.isEmpty(o); }; var getOption = function getOption(options, key, defaultValue) { return isDefined(options[key]) ? options[key] : defaultValue; }; var hasValue = function hasValue(dict, value) { var found = false; Object.keys(dict).forEach(function (key) { if (dict[key] === value) { found = true; } }); return found; }; var sanitise = function sanitise(str) { return typeof str === 'string' ? str.replace(/</g, '&lt;').replace(/>/g, '&gt;') : str; }; 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 c3_axis_fn; var c3_axis_internal_fn; function AxisInternal(component, params) { var internal = this; internal.component = component; internal.params = params || {}; internal.d3 = component.d3; internal.scale = internal.d3.scale.linear(); 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(); } c3_axis_internal_fn = AxisInternal.prototype; c3_axis_internal_fn.axisX = function (selection, x, tickOffset) { selection.attr("transform", function (d) { return "translate(" + Math.ceil(x(d) + tickOffset) + ", 0)"; }); }; c3_axis_internal_fn.axisY = function (selection, y) { selection.attr("transform", function (d) { return "translate(0," + Math.ceil(y(d)) + ")"; }); }; c3_axis_internal_fn.scaleExtent = function (domain) { var start = domain[0], stop = domain[domain.length - 1]; return start < stop ? [start, stop] : [stop, start]; }; c3_axis_internal_fn.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; }; c3_axis_internal_fn.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; }; c3_axis_internal_fn.textFormatted = function (v) { var internal = this, formatted = internal.tickFormat ? internal.tickFormat(v) : v; return typeof formatted !== 'undefined' ? formatted : ''; }; c3_axis_internal_fn.updateRange = function () { var internal = this; internal.range = internal.scale.rangeExtent ? internal.scale.rangeExtent() : internal.scaleExtent(internal.scale.range()); return internal.range; }; c3_axis_internal_fn.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; }; c3_axis_internal_fn.transitionise = function (selection) { return this.params.withoutTransition ? selection : this.d3.transition(selection); }; c3_axis_internal_fn.isVertical = function () { return this.orient === 'left' || this.orient === 'right'; }; c3_axis_internal_fn.tspanData = function (d, i, ticks, scale) { var internal = this; var splitted = internal.params.tickMultiline ? internal.splitTickText(d, ticks, scale) : [].concat(internal.textFormatted(d)); if (internal.params.tickMultiline && internal.params.tickMultilineMax > 0) { splitted = internal.ellipsify(splitted, internal.params.tickMultilineMax); } return splitted.map(function (s) { return { index: i, splitted: s, length: splitted.length }; }); }; c3_axis_internal_fn.splitTickText = function (d, ticks, 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 (!maxWidth || maxWidth <= 0) { maxWidth = internal.isVertical() ? 95 : internal.params.isCategory ? Math.ceil(scale(ticks[1]) - scale(ticks[0])) - 12 : 110; } 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); } return split(splitted, tickText + ""); }; c3_axis_internal_fn.ellipsify = function (splitted, max) { if (splitted.length <= max) { return splitted; } var ellipsified = splitted.slice(0, max); var remaining = 3; 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; if (remaining <= 0) { break; } } return ellipsified; }; c3_axis_internal_fn.updateTickLength = function () { var internal = this; internal.tickLength = Math.max(internal.innerTickSize, 0) + internal.tickPadding; }; c3_axis_internal_fn.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; }; c3_axis_internal_fn.textY = function () { var internal = this, rotate = internal.tickTextRotate; return rotate ? 11.5 - 2.5 * (rotate / 15) * (rotate > 0 ? 1 : -1) : internal.tickLength; }; c3_axis_internal_fn.textTransform = function () { var internal = this, rotate = internal.tickTextRotate; return rotate ? "rotate(" + rotate + ")" : ""; }; c3_axis_internal_fn.textTextAnchor = function () { var internal = this, rotate = internal.tickTextRotate; return rotate ? rotate > 0 ? "start" : "end" : "middle"; }; c3_axis_internal_fn.tspanDx = function () { var internal = this, rotate = internal.tickTextRotate; return rotate ? 8 * Math.sin(Math.PI * (rotate / 180)) : 0; }; c3_axis_internal_fn.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; }; c3_axis_internal_fn.generateAxis = function () { var internal = this, d3 = internal.d3, params = internal.params; function axis(g) { g.each(function () { var g = axis.g = d3.select(this); var scale0 = this.__chart__ || internal.scale, scale1 = this.__chart__ = internal.copyScale(); var ticks = internal.tickValues ? internal.tickValues : internal.generateTicks(scale1), tick = g.selectAll(".tick").data(ticks, scale1), tickEnter = tick.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 = tick.exit().remove(), tickUpdate = internal.transitionise(tick).style("opacity", 1), 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; } tickEnter.append("line"); tickEnter.append("text"); internal.updateRange(); internal.updateTickLength(); internal.updateTickTextCharSize(g.select('.tick')); var lineUpdate = tickUpdate.select("line"), textUpdate = tickUpdate.select("text"), tspanUpdate = tick.select("text").selectAll('tspan').data(function (d, i) { return internal.tspanData(d, i, ticks, scale1); }); tspanUpdate.enter().append('tspan'); tspanUpdate.exit().remove(); tspanUpdate.text(function (d) { return d.splitted; }); var path = g.selectAll(".domain").data([0]), pathUpdate = (path.enter().append("path").attr("class", "domain"), internal.transitionise(path)); // 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); tickUpdate.call(tickTransform, scale1, internal.tickOffset); }); } 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; }; var Axis = function (_Component) { inherits(Axis, _Component); function Axis(owner) { classCallCheck(this, Axis); var fn = { fn: c3_axis_fn, internal: { fn: c3_axis_internal_fn } }; var _this = possibleConstructorReturn(this, (Axis.__proto__ || Object.getPrototypeOf(Axis)).call(this, owner, 'axis', fn)); _this.d3 = owner.d3; _this.internal = AxisInternal; return _this; } return Axis; }(Component); c3_axis_fn = Axis.prototype; c3_axis_fn.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)); }; c3_axis_fn.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; } } return axis; }; c3_axis_fn.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; }; c3_axis_fn.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($$.d3.time[config.axis_y_tick_time_value], config.axis_y_tick_time_interval); } else { axis.tickValues(tickValues); } return axis; }; c3_axis_fn.getId = function getId(id) { var config = this.owner.config; return id in config.data_axes ? config.data_axes[id] : 'y'; }; c3_axis_fn.getXAxisTickFormat = function getXAxisTickFormat() { var $$ = this.owner, config = $$.config, format = $$.isTimeSeries() ? $$.defaultAxisTimeFormat : $$.isCategorized() ? $$.categoryName : function (v) { return v < 0 ? v.toFixed(0) : 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; }; c3_axis_fn.getTickValues = function getTickValues(tickValues, axis) { return tickValues ? tickValues : axis ? axis.tickValues() : undefined; }; c3_axis_fn.getXAxisTickValues = function getXAxisTickValues() { return this.getTickValues(this.owner.config.axis_x_tick_values, this.owner.xAxis); }; c3_axis_fn.getYAxisTickValues = function getYAxisTickValues() { return this.getTickValues(this.owner.config.axis_y_tick_values, this.owner.yAxis); }; c3_axis_fn.getY2AxisTickValues = function getY2AxisTickValues() { return this.getTickValues(this.owner.config.axis_y2_tick_values, this.owner.y2Axis); }; c3_axis_fn.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; }; c3_axis_fn.getLabelText = function getLabelText(axisId) { var option = this.getLabelOptionByAxisId(axisId); return isString(option) ? option : option ? option.text : null; }; c3_axis_fn.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; } }; c3_axis_fn.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 }; }; c3_axis_fn.getXAxisLabelPosition = function getXAxisLabelPosition() { return this.getLabelPosition('x', this.owner.config.axis_rotated ? 'inner-top' : 'inner-right'); }; c3_axis_fn.getYAxisLabelPosition = function getYAxisLabelPosition() { return this.getLabelPosition('y', this.owner.config.axis_rotated ? 'inner-right' : 'inner-top'); }; c3_axis_fn.getY2AxisLabelPosition = function getY2AxisLabelPosition() { return this.getLabelPosition('y2', this.owner.config.axis_rotated ? 'inner-right' : 'inner-top'); }; c3_axis_fn.getLabelPositionById = function getLabelPositionById(id) { return id === 'y2' ? this.getY2AxisLabelPosition() : id === 'y' ? this.getYAxisLabelPosition() : this.getXAxisLabelPosition(); }; c3_axis_fn.textForXAxisLabel = function textForXAxisLabel() { return this.getLabelText('x'); }; c3_axis_fn.textForYAxisLabel = function textForYAxisLabel() { return this.getLabelText('y'); }; c3_axis_fn.textForY2AxisLabel = function textForY2AxisLabel() { return this.getLabelText('y2'); }; c3_axis_fn.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; } }; c3_axis_fn.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"; } }; c3_axis_fn.textAnchorForAxisLabel = function textAnchorForAxisLabel(forHorizontal, position) { if (forHorizontal) { return position.isLeft ? 'start' : position.isCenter ? 'middle' : 'end'; } else { return position.isBottom ? 'start' : position.isMiddle ? 'middle' : 'end'; } }; c3_axis_fn.xForXAxisLabel = function xForXAxisLabel() { return this.xForAxisLabel(!this.owner.config.axis_rotated, this.getXAxisLabelPosition()); }; c3_axis_fn.xForYAxisLabel = function xForYAxisLabel() { return this.xForAxisLabel(this.owner.config.axis_rotated, this.getYAxisLabelPosition()); }; c3_axis_fn.xForY2AxisLabel = function xForY2AxisLabel() { return this.xForAxisLabel(this.owner.config.axis_rotated, this.getY2AxisLabelPosition()); }; c3_axis_fn.dxForXAxisLabel = function dxForXAxisLabel() { return this.dxForAxisLabel(!this.owner.config.axis_rotated, this.getXAxisLabelPosition()); }; c3_axis_fn.dxForYAxisLabel = function dxForYAxisLabel() { return this.dxForAxisLabel(this.owner.config.axis_rotated, this.getYAxisLabelPosition()); }; c3_axis_fn.dxForY2AxisLabel = function dxForY2AxisLabel() { return this.dxForAxisLabel(this.owner.config.axis_rotated, this.getY2AxisLabelPosition()); }; c3_axis_fn.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"; } }; c3_axis_fn.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); } }; c3_axis_fn.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); } }; c3_axis_fn.textAnchorForXAxisLabel = function textAnchorForXAxisLabel() { var $$ = this.owner; return this.textAnchorForAxisLabel(!$$.config.axis_rotated, this.getXAxisLabelPosition()); }; c3_axis_fn.textAnchorForYAxisLabel = function textAnchorForYAxisLabel() { var $$ = this.owner; return this.textAnchorForAxisLabel($$.config.axis_rotated, this.getYAxisLabelPosition()); }; c3_axis_fn.textAnchorForY2AxisLabel = function textAnchorForY2AxisLabel() { var $$ = this.owner; return this.textAnchorForAxisLabel($$.config.axis_rotated, this.getY2AxisLabelPosition()); }; c3_axis_fn.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]; }; c3_axis_fn.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)); }; c3_axis_fn.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); }; c3_axis_fn.convertPixelsToAxisPadding = function convertPixelsToAxisPadding(pixels, domainLength) { var $$ = this.owner, length = $$.config.axis_rotated ? $$.width : $$.height; return domainLength * (pixels / length); }; c3_axis_fn.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 (!forTimeSeries) { tickValues = tickValues.sort(function (a, b) { return a - b; }); } return tickValues; }; c3_axis_fn.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 }; }; c3_axis_fn.redraw = function redraw(transitions, isHidden) { var $$ = this.owner; $$.axes.x.style("opacity", isHidden ? 0 : 1); $$.axes.y.style("opacity", isHidden ? 0 : 1); $$.axes.y2.style("opacity", isHidden ? 0 : 1); $$.axes.subx.style("opacity", isHidden ? 0 : 1); transitions.axisX.call($$.xAxis); transitions.axisY.call($$.yAxis); transitions.axisY2.call($$.y2Axis); transitions.axisSubX.call($$.subXAxis); }; var c3 = { version: "0.4.24" }; var c3_chart_fn; var c3_chart_internal_fn; function Component(owner, componentKey, fn) { this.owner = owner; c3.chart.internal[componentKey] = fn; } 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); } }); })(c3_chart_fn, this, this); } function ChartInternal(api) { var $$ = this; $$.d3 = window.d3 ? window.d3 : typeof require !== 'undefined' ? require("d3") : undefined; $$.api = api; $$.config = $$.getDefaultConfig(); $$.data = {}; $$.cache = {}; $$.axes = {}; } c3.generate = function (config) { return new Chart(config); }; c3.chart = { fn: Chart.prototype, internal: { fn: ChartInternal.prototype } }; c3_chart_fn = c3.chart.fn; c3_chart_internal_fn = c3.chart.internal.fn; c3_chart_internal_fn.beforeInit = function () { // can do something }; c3_chart_internal_fn.afterInit = function () { // can do something }; c3_chart_internal_fn.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.'); } }; c3_chart_internal_fn.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(); $$.dataTimeFormat = config.data_xLocaltime ? d3.time.format : d3.time.format.utc; $$.axisTimeFormat = config.axis_x_localtime ? d3.time.format : d3.time.format.utc; $$.defaultAxisTimeFormat = $$.axisTimeFormat.multi([[".%L", function (d) { return d.getMilliseconds(); }], [":%S", function (d) { return d.getSeconds(); }], ["%I:%M", function (d) { return d.getMinutes(); }], ["%I %p", function (d) { return d.getHours(); }], ["%-m/%-d", function (d) { return d.getDay() && d.getDate() !== 1; }], ["%-m/%-d", function (d) { return d.getDate() !== 1; }], ["%-m/%-d", function (d) { return d.getMonth(); }], ["%Y/%-m/%-d", function () { return true; }]]); $$.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 }; c3_chart_internal_fn.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(); } }; c3_chart_internal_fn.initWithData = function (data) { var $$ = this, d3 = $$.d3, config = $$.config; var defs, main, binding = true; $$.axis = new Axi