|
|
@ -106,7 +106,7 @@ return /******/ (function(modules) { // webpackBootstrap |
|
|
|
exports.Graph2d = __webpack_require__(42); |
|
|
|
exports.timeline = { |
|
|
|
DateUtil: __webpack_require__(24), |
|
|
|
DataStep: __webpack_require__(45), |
|
|
|
DataStep: __webpack_require__(44), |
|
|
|
Range: __webpack_require__(21), |
|
|
|
stack: __webpack_require__(28), |
|
|
|
TimeStep: __webpack_require__(38), |
|
|
@ -123,7 +123,7 @@ return /******/ (function(modules) { // webpackBootstrap |
|
|
|
Component: __webpack_require__(23), |
|
|
|
CurrentTime: __webpack_require__(39), |
|
|
|
CustomTime: __webpack_require__(41), |
|
|
|
DataAxis: __webpack_require__(44), |
|
|
|
DataAxis: __webpack_require__(45), |
|
|
|
GraphGroup: __webpack_require__(46), |
|
|
|
Group: __webpack_require__(27), |
|
|
|
BackgroundGroup: __webpack_require__(31), |
|
|
@ -19733,7 +19733,7 @@ return /******/ (function(modules) { // webpackBootstrap |
|
|
|
var DataSet = __webpack_require__(7); |
|
|
|
var DataView = __webpack_require__(9); |
|
|
|
var Component = __webpack_require__(23); |
|
|
|
var DataAxis = __webpack_require__(44); |
|
|
|
var DataAxis = __webpack_require__(45); |
|
|
|
var GraphGroup = __webpack_require__(46); |
|
|
|
var Legend = __webpack_require__(50); |
|
|
|
var BarGraphFunctions = __webpack_require__(49); |
|
|
@ -19829,6 +19829,7 @@ return /******/ (function(modules) { // webpackBootstrap |
|
|
|
this.groups = {}; |
|
|
|
this.abortedGraphUpdate = false; |
|
|
|
this.updateSVGheight = false; |
|
|
|
this.updateSVGheightOnResize = false; |
|
|
|
|
|
|
|
var me = this; |
|
|
|
this.itemsData = null; // DataSet
|
|
|
@ -19923,6 +19924,7 @@ return /******/ (function(modules) { // webpackBootstrap |
|
|
|
var fields = ['sampling','defaultGroup','height','graphHeight','yAxisOrientation','style','barChart','dataAxis','sort','groups']; |
|
|
|
if (options.graphHeight === undefined && options.height !== undefined && this.body.domProps.centerContainer.height !== undefined) { |
|
|
|
this.updateSVGheight = true; |
|
|
|
this.updateSVGheightOnResize = true; |
|
|
|
} |
|
|
|
else if (this.body.domProps.centerContainer.height !== undefined && options.graphHeight !== undefined) { |
|
|
|
if (parseInt((options.graphHeight + '').replace("px",'')) < this.body.domProps.centerContainer.height) { |
|
|
@ -20296,7 +20298,7 @@ return /******/ (function(modules) { // webpackBootstrap |
|
|
|
this.svg.style.left = util.option.asSize(-this.props.width); |
|
|
|
|
|
|
|
// if the height of the graph is set as proportional, change the height of the svg
|
|
|
|
if ((this.options.height + '').indexOf("%") != -1) { |
|
|
|
if ((this.options.height + '').indexOf("%") != -1 || this.updateSVGheightOnResize == true) { |
|
|
|
this.updateSVGheight = true; |
|
|
|
} |
|
|
|
} |
|
|
@ -20725,12 +20727,293 @@ return /******/ (function(modules) { // webpackBootstrap |
|
|
|
|
|
|
|
/***/ }, |
|
|
|
/* 44 */ |
|
|
|
/***/ function(module, exports, __webpack_require__) { |
|
|
|
|
|
|
|
/** |
|
|
|
* @constructor DataStep |
|
|
|
* The class DataStep is an iterator for data for the lineGraph. You provide a start data point and an |
|
|
|
* end data point. The class itself determines the best scale (step size) based on the |
|
|
|
* provided start Date, end Date, and minimumStep. |
|
|
|
* |
|
|
|
* If minimumStep is provided, the step size is chosen as close as possible |
|
|
|
* to the minimumStep but larger than minimumStep. If minimumStep is not |
|
|
|
* provided, the scale is set to 1 DAY. |
|
|
|
* The minimumStep should correspond with the onscreen size of about 6 characters |
|
|
|
* |
|
|
|
* Alternatively, you can set a scale by hand. |
|
|
|
* After creation, you can initialize the class by executing first(). Then you |
|
|
|
* can iterate from the start date to the end date via next(). You can check if |
|
|
|
* the end date is reached with the function hasNext(). After each step, you can |
|
|
|
* retrieve the current date via getCurrent(). |
|
|
|
* The DataStep has scales ranging from milliseconds, seconds, minutes, hours, |
|
|
|
* days, to years. |
|
|
|
* |
|
|
|
* Version: 1.2 |
|
|
|
* |
|
|
|
* @param {Date} [start] The start date, for example new Date(2010, 9, 21) |
|
|
|
* or new Date(2010, 9, 21, 23, 45, 00) |
|
|
|
* @param {Date} [end] The end date |
|
|
|
* @param {Number} [minimumStep] Optional. Minimum step size in milliseconds |
|
|
|
*/ |
|
|
|
function DataStep(start, end, minimumStep, containerHeight, customRange, alignZeros) { |
|
|
|
// variables
|
|
|
|
this.current = 0; |
|
|
|
|
|
|
|
this.autoScale = true; |
|
|
|
this.stepIndex = 0; |
|
|
|
this.step = 1; |
|
|
|
this.scale = 1; |
|
|
|
|
|
|
|
this.marginStart; |
|
|
|
this.marginEnd; |
|
|
|
this.deadSpace = 0; |
|
|
|
|
|
|
|
this.majorSteps = [1, 2, 5, 10]; |
|
|
|
this.minorSteps = [0.25, 0.5, 1, 2]; |
|
|
|
|
|
|
|
this.alignZeros = alignZeros; |
|
|
|
|
|
|
|
this.setRange(start, end, minimumStep, containerHeight, customRange); |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
* Set a new range |
|
|
|
* If minimumStep is provided, the step size is chosen as close as possible |
|
|
|
* to the minimumStep but larger than minimumStep. If minimumStep is not |
|
|
|
* provided, the scale is set to 1 DAY. |
|
|
|
* The minimumStep should correspond with the onscreen size of about 6 characters |
|
|
|
* @param {Number} [start] The start date and time. |
|
|
|
* @param {Number} [end] The end date and time. |
|
|
|
* @param {Number} [minimumStep] Optional. Minimum step size in milliseconds |
|
|
|
*/ |
|
|
|
DataStep.prototype.setRange = function(start, end, minimumStep, containerHeight, customRange) { |
|
|
|
this._start = customRange.min === undefined ? start : customRange.min; |
|
|
|
this._end = customRange.max === undefined ? end : customRange.max; |
|
|
|
|
|
|
|
if (this._start == this._end) { |
|
|
|
this._start -= 0.75; |
|
|
|
this._end += 1; |
|
|
|
} |
|
|
|
|
|
|
|
if (this.autoScale == true) { |
|
|
|
this.setMinimumStep(minimumStep, containerHeight); |
|
|
|
} |
|
|
|
|
|
|
|
this.setFirst(customRange); |
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Automatically determine the scale that bests fits the provided minimum step |
|
|
|
* @param {Number} [minimumStep] The minimum step size in milliseconds |
|
|
|
*/ |
|
|
|
DataStep.prototype.setMinimumStep = function(minimumStep, containerHeight) { |
|
|
|
// round to floor
|
|
|
|
var size = this._end - this._start; |
|
|
|
var safeSize = size * 1.2; |
|
|
|
var minimumStepValue = minimumStep * (safeSize / containerHeight); |
|
|
|
var orderOfMagnitude = Math.round(Math.log(safeSize)/Math.LN10); |
|
|
|
|
|
|
|
var minorStepIdx = -1; |
|
|
|
var magnitudefactor = Math.pow(10,orderOfMagnitude); |
|
|
|
|
|
|
|
var start = 0; |
|
|
|
if (orderOfMagnitude < 0) { |
|
|
|
start = orderOfMagnitude; |
|
|
|
} |
|
|
|
|
|
|
|
var solutionFound = false; |
|
|
|
for (var i = start; Math.abs(i) <= Math.abs(orderOfMagnitude); i++) { |
|
|
|
magnitudefactor = Math.pow(10,i); |
|
|
|
for (var j = 0; j < this.minorSteps.length; j++) { |
|
|
|
var stepSize = magnitudefactor * this.minorSteps[j]; |
|
|
|
if (stepSize >= minimumStepValue) { |
|
|
|
solutionFound = true; |
|
|
|
minorStepIdx = j; |
|
|
|
break; |
|
|
|
} |
|
|
|
} |
|
|
|
if (solutionFound == true) { |
|
|
|
break; |
|
|
|
} |
|
|
|
} |
|
|
|
this.stepIndex = minorStepIdx; |
|
|
|
this.scale = magnitudefactor; |
|
|
|
this.step = magnitudefactor * this.minorSteps[minorStepIdx]; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
* Round the current date to the first minor date value |
|
|
|
* This must be executed once when the current date is set to start Date |
|
|
|
*/ |
|
|
|
DataStep.prototype.setFirst = function(customRange) { |
|
|
|
if (customRange === undefined) { |
|
|
|
customRange = {}; |
|
|
|
} |
|
|
|
|
|
|
|
var niceStart = customRange.min === undefined ? this._start - (this.scale * 2 * this.minorSteps[this.stepIndex]) : customRange.min; |
|
|
|
var niceEnd = customRange.max === undefined ? this._end + (this.scale * this.minorSteps[this.stepIndex]) : customRange.max; |
|
|
|
|
|
|
|
this.marginEnd = customRange.max === undefined ? this.roundToMinor(niceEnd) : customRange.max; |
|
|
|
this.marginStart = customRange.min === undefined ? this.roundToMinor(niceStart) : customRange.min; |
|
|
|
|
|
|
|
// if we need to align the zero's we need to make sure that there is a zero to use.
|
|
|
|
if (this.alignZeros == true && (this.marginEnd - this.marginStart) % this.step != 0) { |
|
|
|
this.marginEnd += this.marginEnd % this.step; |
|
|
|
} |
|
|
|
|
|
|
|
this.deadSpace = this.roundToMinor(niceEnd) - niceEnd + this.roundToMinor(niceStart) - niceStart; |
|
|
|
this.marginRange = this.marginEnd - this.marginStart; |
|
|
|
|
|
|
|
|
|
|
|
this.current = this.marginEnd; |
|
|
|
}; |
|
|
|
|
|
|
|
DataStep.prototype.roundToMinor = function(value) { |
|
|
|
var rounded = value - (value % (this.scale * this.minorSteps[this.stepIndex])); |
|
|
|
if (value % (this.scale * this.minorSteps[this.stepIndex]) > 0.5 * (this.scale * this.minorSteps[this.stepIndex])) { |
|
|
|
return rounded + (this.scale * this.minorSteps[this.stepIndex]); |
|
|
|
} |
|
|
|
else { |
|
|
|
return rounded; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
* Check if the there is a next step |
|
|
|
* @return {boolean} true if the current date has not passed the end date |
|
|
|
*/ |
|
|
|
DataStep.prototype.hasNext = function () { |
|
|
|
return (this.current >= this.marginStart); |
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Do the next step |
|
|
|
*/ |
|
|
|
DataStep.prototype.next = function() { |
|
|
|
var prev = this.current; |
|
|
|
this.current -= this.step; |
|
|
|
|
|
|
|
// safety mechanism: if current time is still unchanged, move to the end
|
|
|
|
if (this.current == prev) { |
|
|
|
this.current = this._end; |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Do the next step |
|
|
|
*/ |
|
|
|
DataStep.prototype.previous = function() { |
|
|
|
this.current += this.step; |
|
|
|
this.marginEnd += this.step; |
|
|
|
this.marginRange = this.marginEnd - this.marginStart; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
* Get the current datetime |
|
|
|
* @return {String} current The current date |
|
|
|
*/ |
|
|
|
DataStep.prototype.getCurrent = function(decimals) { |
|
|
|
// prevent round-off errors when close to zero
|
|
|
|
var current = (Math.abs(this.current) < this.step / 2) ? 0 : this.current; |
|
|
|
var toPrecision = '' + Number(current).toPrecision(5); |
|
|
|
|
|
|
|
// If decimals is specified, then limit or extend the string as required
|
|
|
|
if(decimals !== undefined && !isNaN(Number(decimals))) { |
|
|
|
// If string includes exponent, then we need to add it to the end
|
|
|
|
var exp = ""; |
|
|
|
var index = toPrecision.indexOf("e"); |
|
|
|
if(index != -1) { |
|
|
|
// Get the exponent
|
|
|
|
exp = toPrecision.slice(index); |
|
|
|
// Remove the exponent in case we need to zero-extend
|
|
|
|
toPrecision = toPrecision.slice(0, index); |
|
|
|
} |
|
|
|
index = Math.max(toPrecision.indexOf(","), toPrecision.indexOf(".")); |
|
|
|
if(index === -1) { |
|
|
|
// No decimal found - if we want decimals, then we need to add it
|
|
|
|
if(decimals !== 0) { |
|
|
|
toPrecision += '.'; |
|
|
|
} |
|
|
|
// Calculate how long the string should be
|
|
|
|
index = toPrecision.length + decimals; |
|
|
|
} |
|
|
|
else if(decimals !== 0) { |
|
|
|
// Calculate how long the string should be - accounting for the decimal place
|
|
|
|
index += decimals + 1; |
|
|
|
} |
|
|
|
if(index > toPrecision.length) { |
|
|
|
// We need to add zeros!
|
|
|
|
for(var cnt = index - toPrecision.length; cnt > 0; cnt--) { |
|
|
|
toPrecision += '0'; |
|
|
|
} |
|
|
|
} |
|
|
|
else { |
|
|
|
// we need to remove characters
|
|
|
|
toPrecision = toPrecision.slice(0, index); |
|
|
|
} |
|
|
|
// Add the exponent if there is one
|
|
|
|
toPrecision += exp; |
|
|
|
} |
|
|
|
else { |
|
|
|
if (toPrecision.indexOf(",") != -1 || toPrecision.indexOf(".") != -1) { |
|
|
|
// If no decimal is specified, and there are decimal places, remove trailing zeros
|
|
|
|
for (var i = toPrecision.length - 1; i > 0; i--) { |
|
|
|
if (toPrecision[i] == "0") { |
|
|
|
toPrecision = toPrecision.slice(0, i); |
|
|
|
} |
|
|
|
else if (toPrecision[i] == "." || toPrecision[i] == ",") { |
|
|
|
toPrecision = toPrecision.slice(0, i); |
|
|
|
break; |
|
|
|
} |
|
|
|
else { |
|
|
|
break; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
return toPrecision; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
* Snap a date to a rounded value. |
|
|
|
* The snap intervals are dependent on the current scale and step. |
|
|
|
* @param {Date} date the date to be snapped. |
|
|
|
* @return {Date} snappedDate |
|
|
|
*/ |
|
|
|
DataStep.prototype.snap = function(date) { |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Check if the current value is a major value (for example when the step |
|
|
|
* is DAY, a major value is each first day of the MONTH) |
|
|
|
* @return {boolean} true if current date is major, else false. |
|
|
|
*/ |
|
|
|
DataStep.prototype.isMajor = function() { |
|
|
|
return (this.current % (this.scale * this.majorSteps[this.stepIndex]) == 0); |
|
|
|
}; |
|
|
|
|
|
|
|
module.exports = DataStep; |
|
|
|
|
|
|
|
|
|
|
|
/***/ }, |
|
|
|
/* 45 */ |
|
|
|
/***/ function(module, exports, __webpack_require__) { |
|
|
|
|
|
|
|
var util = __webpack_require__(1); |
|
|
|
var DOMutil = __webpack_require__(6); |
|
|
|
var Component = __webpack_require__(23); |
|
|
|
var DataStep = __webpack_require__(45); |
|
|
|
var DataStep = __webpack_require__(44); |
|
|
|
|
|
|
|
/** |
|
|
|
* A horizontal time axis |
|
|
@ -21229,403 +21512,131 @@ return /******/ (function(modules) { // webpackBootstrap |
|
|
|
label.innerHTML = text; |
|
|
|
if (orientation == 'left') { |
|
|
|
label.style.left = '-' + this.options.labelOffsetX + 'px'; |
|
|
|
label.style.textAlign = "right"; |
|
|
|
} |
|
|
|
else { |
|
|
|
label.style.right = '-' + this.options.labelOffsetX + 'px'; |
|
|
|
label.style.textAlign = "left"; |
|
|
|
} |
|
|
|
|
|
|
|
label.style.top = y - 0.5 * characterHeight + this.options.labelOffsetY + 'px'; |
|
|
|
|
|
|
|
text += ''; |
|
|
|
|
|
|
|
var largestWidth = Math.max(this.props.majorCharWidth,this.props.minorCharWidth); |
|
|
|
if (this.maxLabelSize < text.length * largestWidth) { |
|
|
|
this.maxLabelSize = text.length * largestWidth; |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Create a minor line for the axis at position y |
|
|
|
* @param y |
|
|
|
* @param orientation |
|
|
|
* @param className |
|
|
|
* @param offset |
|
|
|
* @param width |
|
|
|
*/ |
|
|
|
DataAxis.prototype._redrawLine = function (y, orientation, className, offset, width) { |
|
|
|
if (this.master == true) { |
|
|
|
var line = DOMutil.getDOMElement('div',this.DOMelements.lines, this.dom.lineContainer);//this.dom.redundant.lines.shift();
|
|
|
|
line.className = className; |
|
|
|
line.innerHTML = ''; |
|
|
|
|
|
|
|
if (orientation == 'left') { |
|
|
|
line.style.left = (this.width - offset) + 'px'; |
|
|
|
} |
|
|
|
else { |
|
|
|
line.style.right = (this.width - offset) + 'px'; |
|
|
|
} |
|
|
|
|
|
|
|
line.style.width = width + 'px'; |
|
|
|
line.style.top = y + 'px'; |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Create a title for the axis |
|
|
|
* @private |
|
|
|
* @param orientation |
|
|
|
*/ |
|
|
|
DataAxis.prototype._redrawTitle = function (orientation) { |
|
|
|
DOMutil.prepareElements(this.DOMelements.title); |
|
|
|
|
|
|
|
// Check if the title is defined for this axes
|
|
|
|
if (this.options.title[orientation] !== undefined && this.options.title[orientation].text !== undefined) { |
|
|
|
var title = DOMutil.getDOMElement('div', this.DOMelements.title, this.dom.frame); |
|
|
|
title.className = 'yAxis title ' + orientation; |
|
|
|
title.innerHTML = this.options.title[orientation].text; |
|
|
|
|
|
|
|
// Add style - if provided
|
|
|
|
if (this.options.title[orientation].style !== undefined) { |
|
|
|
util.addCssText(title, this.options.title[orientation].style); |
|
|
|
} |
|
|
|
|
|
|
|
if (orientation == 'left') { |
|
|
|
title.style.left = this.props.titleCharHeight + 'px'; |
|
|
|
} |
|
|
|
else { |
|
|
|
title.style.right = this.props.titleCharHeight + 'px'; |
|
|
|
} |
|
|
|
|
|
|
|
title.style.width = this.height + 'px'; |
|
|
|
} |
|
|
|
|
|
|
|
// we need to clean up in case we did not use all elements.
|
|
|
|
DOMutil.cleanupElements(this.DOMelements.title); |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
* Determine the size of text on the axis (both major and minor axis). |
|
|
|
* The size is calculated only once and then cached in this.props. |
|
|
|
* @private |
|
|
|
*/ |
|
|
|
DataAxis.prototype._calculateCharSize = function () { |
|
|
|
// determine the char width and height on the minor axis
|
|
|
|
if (!('minorCharHeight' in this.props)) { |
|
|
|
var textMinor = document.createTextNode('0'); |
|
|
|
var measureCharMinor = document.createElement('div'); |
|
|
|
measureCharMinor.className = 'yAxis minor measure'; |
|
|
|
measureCharMinor.appendChild(textMinor); |
|
|
|
this.dom.frame.appendChild(measureCharMinor); |
|
|
|
|
|
|
|
this.props.minorCharHeight = measureCharMinor.clientHeight; |
|
|
|
this.props.minorCharWidth = measureCharMinor.clientWidth; |
|
|
|
|
|
|
|
this.dom.frame.removeChild(measureCharMinor); |
|
|
|
} |
|
|
|
|
|
|
|
if (!('majorCharHeight' in this.props)) { |
|
|
|
var textMajor = document.createTextNode('0'); |
|
|
|
var measureCharMajor = document.createElement('div'); |
|
|
|
measureCharMajor.className = 'yAxis major measure'; |
|
|
|
measureCharMajor.appendChild(textMajor); |
|
|
|
this.dom.frame.appendChild(measureCharMajor); |
|
|
|
|
|
|
|
this.props.majorCharHeight = measureCharMajor.clientHeight; |
|
|
|
this.props.majorCharWidth = measureCharMajor.clientWidth; |
|
|
|
|
|
|
|
this.dom.frame.removeChild(measureCharMajor); |
|
|
|
} |
|
|
|
|
|
|
|
if (!('titleCharHeight' in this.props)) { |
|
|
|
var textTitle = document.createTextNode('0'); |
|
|
|
var measureCharTitle = document.createElement('div'); |
|
|
|
measureCharTitle.className = 'yAxis title measure'; |
|
|
|
measureCharTitle.appendChild(textTitle); |
|
|
|
this.dom.frame.appendChild(measureCharTitle); |
|
|
|
|
|
|
|
this.props.titleCharHeight = measureCharTitle.clientHeight; |
|
|
|
this.props.titleCharWidth = measureCharTitle.clientWidth; |
|
|
|
|
|
|
|
this.dom.frame.removeChild(measureCharTitle); |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Snap a date to a rounded value. |
|
|
|
* The snap intervals are dependent on the current scale and step. |
|
|
|
* @param {Date} date the date to be snapped. |
|
|
|
* @return {Date} snappedDate |
|
|
|
*/ |
|
|
|
DataAxis.prototype.snap = function(date) { |
|
|
|
return this.step.snap(date); |
|
|
|
}; |
|
|
|
|
|
|
|
module.exports = DataAxis; |
|
|
|
|
|
|
|
|
|
|
|
/***/ }, |
|
|
|
/* 45 */ |
|
|
|
/***/ function(module, exports, __webpack_require__) { |
|
|
|
|
|
|
|
/** |
|
|
|
* @constructor DataStep |
|
|
|
* The class DataStep is an iterator for data for the lineGraph. You provide a start data point and an |
|
|
|
* end data point. The class itself determines the best scale (step size) based on the |
|
|
|
* provided start Date, end Date, and minimumStep. |
|
|
|
* |
|
|
|
* If minimumStep is provided, the step size is chosen as close as possible |
|
|
|
* to the minimumStep but larger than minimumStep. If minimumStep is not |
|
|
|
* provided, the scale is set to 1 DAY. |
|
|
|
* The minimumStep should correspond with the onscreen size of about 6 characters |
|
|
|
* |
|
|
|
* Alternatively, you can set a scale by hand. |
|
|
|
* After creation, you can initialize the class by executing first(). Then you |
|
|
|
* can iterate from the start date to the end date via next(). You can check if |
|
|
|
* the end date is reached with the function hasNext(). After each step, you can |
|
|
|
* retrieve the current date via getCurrent(). |
|
|
|
* The DataStep has scales ranging from milliseconds, seconds, minutes, hours, |
|
|
|
* days, to years. |
|
|
|
* |
|
|
|
* Version: 1.2 |
|
|
|
* |
|
|
|
* @param {Date} [start] The start date, for example new Date(2010, 9, 21) |
|
|
|
* or new Date(2010, 9, 21, 23, 45, 00) |
|
|
|
* @param {Date} [end] The end date |
|
|
|
* @param {Number} [minimumStep] Optional. Minimum step size in milliseconds |
|
|
|
*/ |
|
|
|
function DataStep(start, end, minimumStep, containerHeight, customRange, alignZeros) { |
|
|
|
// variables
|
|
|
|
this.current = 0; |
|
|
|
|
|
|
|
this.autoScale = true; |
|
|
|
this.stepIndex = 0; |
|
|
|
this.step = 1; |
|
|
|
this.scale = 1; |
|
|
|
|
|
|
|
this.marginStart; |
|
|
|
this.marginEnd; |
|
|
|
this.deadSpace = 0; |
|
|
|
|
|
|
|
this.majorSteps = [1, 2, 5, 10]; |
|
|
|
this.minorSteps = [0.25, 0.5, 1, 2]; |
|
|
|
|
|
|
|
this.alignZeros = alignZeros; |
|
|
|
|
|
|
|
this.setRange(start, end, minimumStep, containerHeight, customRange); |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
* Set a new range |
|
|
|
* If minimumStep is provided, the step size is chosen as close as possible |
|
|
|
* to the minimumStep but larger than minimumStep. If minimumStep is not |
|
|
|
* provided, the scale is set to 1 DAY. |
|
|
|
* The minimumStep should correspond with the onscreen size of about 6 characters |
|
|
|
* @param {Number} [start] The start date and time. |
|
|
|
* @param {Number} [end] The end date and time. |
|
|
|
* @param {Number} [minimumStep] Optional. Minimum step size in milliseconds |
|
|
|
*/ |
|
|
|
DataStep.prototype.setRange = function(start, end, minimumStep, containerHeight, customRange) { |
|
|
|
this._start = customRange.min === undefined ? start : customRange.min; |
|
|
|
this._end = customRange.max === undefined ? end : customRange.max; |
|
|
|
|
|
|
|
if (this._start == this._end) { |
|
|
|
this._start -= 0.75; |
|
|
|
this._end += 1; |
|
|
|
label.style.textAlign = "right"; |
|
|
|
} |
|
|
|
|
|
|
|
if (this.autoScale == true) { |
|
|
|
this.setMinimumStep(minimumStep, containerHeight); |
|
|
|
else { |
|
|
|
label.style.right = '-' + this.options.labelOffsetX + 'px'; |
|
|
|
label.style.textAlign = "left"; |
|
|
|
} |
|
|
|
|
|
|
|
this.setFirst(customRange); |
|
|
|
label.style.top = y - 0.5 * characterHeight + this.options.labelOffsetY + 'px'; |
|
|
|
|
|
|
|
text += ''; |
|
|
|
|
|
|
|
var largestWidth = Math.max(this.props.majorCharWidth,this.props.minorCharWidth); |
|
|
|
if (this.maxLabelSize < text.length * largestWidth) { |
|
|
|
this.maxLabelSize = text.length * largestWidth; |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Automatically determine the scale that bests fits the provided minimum step |
|
|
|
* @param {Number} [minimumStep] The minimum step size in milliseconds |
|
|
|
* Create a minor line for the axis at position y |
|
|
|
* @param y |
|
|
|
* @param orientation |
|
|
|
* @param className |
|
|
|
* @param offset |
|
|
|
* @param width |
|
|
|
*/ |
|
|
|
DataStep.prototype.setMinimumStep = function(minimumStep, containerHeight) { |
|
|
|
// round to floor
|
|
|
|
var size = this._end - this._start; |
|
|
|
var safeSize = size * 1.2; |
|
|
|
var minimumStepValue = minimumStep * (safeSize / containerHeight); |
|
|
|
var orderOfMagnitude = Math.round(Math.log(safeSize)/Math.LN10); |
|
|
|
|
|
|
|
var minorStepIdx = -1; |
|
|
|
var magnitudefactor = Math.pow(10,orderOfMagnitude); |
|
|
|
|
|
|
|
var start = 0; |
|
|
|
if (orderOfMagnitude < 0) { |
|
|
|
start = orderOfMagnitude; |
|
|
|
} |
|
|
|
DataAxis.prototype._redrawLine = function (y, orientation, className, offset, width) { |
|
|
|
if (this.master == true) { |
|
|
|
var line = DOMutil.getDOMElement('div',this.DOMelements.lines, this.dom.lineContainer);//this.dom.redundant.lines.shift();
|
|
|
|
line.className = className; |
|
|
|
line.innerHTML = ''; |
|
|
|
|
|
|
|
var solutionFound = false; |
|
|
|
for (var i = start; Math.abs(i) <= Math.abs(orderOfMagnitude); i++) { |
|
|
|
magnitudefactor = Math.pow(10,i); |
|
|
|
for (var j = 0; j < this.minorSteps.length; j++) { |
|
|
|
var stepSize = magnitudefactor * this.minorSteps[j]; |
|
|
|
if (stepSize >= minimumStepValue) { |
|
|
|
solutionFound = true; |
|
|
|
minorStepIdx = j; |
|
|
|
break; |
|
|
|
} |
|
|
|
if (orientation == 'left') { |
|
|
|
line.style.left = (this.width - offset) + 'px'; |
|
|
|
} |
|
|
|
if (solutionFound == true) { |
|
|
|
break; |
|
|
|
else { |
|
|
|
line.style.right = (this.width - offset) + 'px'; |
|
|
|
} |
|
|
|
|
|
|
|
line.style.width = width + 'px'; |
|
|
|
line.style.top = y + 'px'; |
|
|
|
} |
|
|
|
this.stepIndex = minorStepIdx; |
|
|
|
this.scale = magnitudefactor; |
|
|
|
this.step = magnitudefactor * this.minorSteps[minorStepIdx]; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
* Round the current date to the first minor date value |
|
|
|
* This must be executed once when the current date is set to start Date |
|
|
|
* Create a title for the axis |
|
|
|
* @private |
|
|
|
* @param orientation |
|
|
|
*/ |
|
|
|
DataStep.prototype.setFirst = function(customRange) { |
|
|
|
if (customRange === undefined) { |
|
|
|
customRange = {}; |
|
|
|
} |
|
|
|
|
|
|
|
var niceStart = customRange.min === undefined ? this._start - (this.scale * 2 * this.minorSteps[this.stepIndex]) : customRange.min; |
|
|
|
var niceEnd = customRange.max === undefined ? this._end + (this.scale * this.minorSteps[this.stepIndex]) : customRange.max; |
|
|
|
DataAxis.prototype._redrawTitle = function (orientation) { |
|
|
|
DOMutil.prepareElements(this.DOMelements.title); |
|
|
|
|
|
|
|
this.marginEnd = customRange.max === undefined ? this.roundToMinor(niceEnd) : customRange.max; |
|
|
|
this.marginStart = customRange.min === undefined ? this.roundToMinor(niceStart) : customRange.min; |
|
|
|
// Check if the title is defined for this axes
|
|
|
|
if (this.options.title[orientation] !== undefined && this.options.title[orientation].text !== undefined) { |
|
|
|
var title = DOMutil.getDOMElement('div', this.DOMelements.title, this.dom.frame); |
|
|
|
title.className = 'yAxis title ' + orientation; |
|
|
|
title.innerHTML = this.options.title[orientation].text; |
|
|
|
|
|
|
|
// if we need to align the zero's we need to make sure that there is a zero to use.
|
|
|
|
if (this.alignZeros == true && (this.marginEnd - this.marginStart) % this.step != 0) { |
|
|
|
this.marginEnd += this.marginEnd % this.step; |
|
|
|
} |
|
|
|
// Add style - if provided
|
|
|
|
if (this.options.title[orientation].style !== undefined) { |
|
|
|
util.addCssText(title, this.options.title[orientation].style); |
|
|
|
} |
|
|
|
|
|
|
|
this.deadSpace = this.roundToMinor(niceEnd) - niceEnd + this.roundToMinor(niceStart) - niceStart; |
|
|
|
this.marginRange = this.marginEnd - this.marginStart; |
|
|
|
if (orientation == 'left') { |
|
|
|
title.style.left = this.props.titleCharHeight + 'px'; |
|
|
|
} |
|
|
|
else { |
|
|
|
title.style.right = this.props.titleCharHeight + 'px'; |
|
|
|
} |
|
|
|
|
|
|
|
title.style.width = this.height + 'px'; |
|
|
|
} |
|
|
|
|
|
|
|
this.current = this.marginEnd; |
|
|
|
// we need to clean up in case we did not use all elements.
|
|
|
|
DOMutil.cleanupElements(this.DOMelements.title); |
|
|
|
}; |
|
|
|
|
|
|
|
DataStep.prototype.roundToMinor = function(value) { |
|
|
|
var rounded = value - (value % (this.scale * this.minorSteps[this.stepIndex])); |
|
|
|
if (value % (this.scale * this.minorSteps[this.stepIndex]) > 0.5 * (this.scale * this.minorSteps[this.stepIndex])) { |
|
|
|
return rounded + (this.scale * this.minorSteps[this.stepIndex]); |
|
|
|
} |
|
|
|
else { |
|
|
|
return rounded; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
* Check if the there is a next step |
|
|
|
* @return {boolean} true if the current date has not passed the end date |
|
|
|
*/ |
|
|
|
DataStep.prototype.hasNext = function () { |
|
|
|
return (this.current >= this.marginStart); |
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Do the next step |
|
|
|
* Determine the size of text on the axis (both major and minor axis). |
|
|
|
* The size is calculated only once and then cached in this.props. |
|
|
|
* @private |
|
|
|
*/ |
|
|
|
DataStep.prototype.next = function() { |
|
|
|
var prev = this.current; |
|
|
|
this.current -= this.step; |
|
|
|
|
|
|
|
// safety mechanism: if current time is still unchanged, move to the end
|
|
|
|
if (this.current == prev) { |
|
|
|
this.current = this._end; |
|
|
|
} |
|
|
|
}; |
|
|
|
DataAxis.prototype._calculateCharSize = function () { |
|
|
|
// determine the char width and height on the minor axis
|
|
|
|
if (!('minorCharHeight' in this.props)) { |
|
|
|
var textMinor = document.createTextNode('0'); |
|
|
|
var measureCharMinor = document.createElement('div'); |
|
|
|
measureCharMinor.className = 'yAxis minor measure'; |
|
|
|
measureCharMinor.appendChild(textMinor); |
|
|
|
this.dom.frame.appendChild(measureCharMinor); |
|
|
|
|
|
|
|
/** |
|
|
|
* Do the next step |
|
|
|
*/ |
|
|
|
DataStep.prototype.previous = function() { |
|
|
|
this.current += this.step; |
|
|
|
this.marginEnd += this.step; |
|
|
|
this.marginRange = this.marginEnd - this.marginStart; |
|
|
|
}; |
|
|
|
this.props.minorCharHeight = measureCharMinor.clientHeight; |
|
|
|
this.props.minorCharWidth = measureCharMinor.clientWidth; |
|
|
|
|
|
|
|
this.dom.frame.removeChild(measureCharMinor); |
|
|
|
} |
|
|
|
|
|
|
|
if (!('majorCharHeight' in this.props)) { |
|
|
|
var textMajor = document.createTextNode('0'); |
|
|
|
var measureCharMajor = document.createElement('div'); |
|
|
|
measureCharMajor.className = 'yAxis major measure'; |
|
|
|
measureCharMajor.appendChild(textMajor); |
|
|
|
this.dom.frame.appendChild(measureCharMajor); |
|
|
|
|
|
|
|
/** |
|
|
|
* Get the current datetime |
|
|
|
* @return {String} current The current date |
|
|
|
*/ |
|
|
|
DataStep.prototype.getCurrent = function(decimals) { |
|
|
|
// prevent round-off errors when close to zero
|
|
|
|
var current = (Math.abs(this.current) < this.step / 2) ? 0 : this.current; |
|
|
|
var toPrecision = '' + Number(current).toPrecision(5); |
|
|
|
this.props.majorCharHeight = measureCharMajor.clientHeight; |
|
|
|
this.props.majorCharWidth = measureCharMajor.clientWidth; |
|
|
|
|
|
|
|
// If decimals is specified, then limit or extend the string as required
|
|
|
|
if(decimals !== undefined && !isNaN(Number(decimals))) { |
|
|
|
// If string includes exponent, then we need to add it to the end
|
|
|
|
var exp = ""; |
|
|
|
var index = toPrecision.indexOf("e"); |
|
|
|
if(index != -1) { |
|
|
|
// Get the exponent
|
|
|
|
exp = toPrecision.slice(index); |
|
|
|
// Remove the exponent in case we need to zero-extend
|
|
|
|
toPrecision = toPrecision.slice(0, index); |
|
|
|
} |
|
|
|
index = Math.max(toPrecision.indexOf(","), toPrecision.indexOf(".")); |
|
|
|
if(index === -1) { |
|
|
|
// No decimal found - if we want decimals, then we need to add it
|
|
|
|
if(decimals !== 0) { |
|
|
|
toPrecision += '.'; |
|
|
|
} |
|
|
|
// Calculate how long the string should be
|
|
|
|
index = toPrecision.length + decimals; |
|
|
|
} |
|
|
|
else if(decimals !== 0) { |
|
|
|
// Calculate how long the string should be - accounting for the decimal place
|
|
|
|
index += decimals + 1; |
|
|
|
} |
|
|
|
if(index > toPrecision.length) { |
|
|
|
// We need to add zeros!
|
|
|
|
for(var cnt = index - toPrecision.length; cnt > 0; cnt--) { |
|
|
|
toPrecision += '0'; |
|
|
|
} |
|
|
|
} |
|
|
|
else { |
|
|
|
// we need to remove characters
|
|
|
|
toPrecision = toPrecision.slice(0, index); |
|
|
|
} |
|
|
|
// Add the exponent if there is one
|
|
|
|
toPrecision += exp; |
|
|
|
} |
|
|
|
else { |
|
|
|
if (toPrecision.indexOf(",") != -1 || toPrecision.indexOf(".") != -1) { |
|
|
|
// If no decimal is specified, and there are decimal places, remove trailing zeros
|
|
|
|
for (var i = toPrecision.length - 1; i > 0; i--) { |
|
|
|
if (toPrecision[i] == "0") { |
|
|
|
toPrecision = toPrecision.slice(0, i); |
|
|
|
} |
|
|
|
else if (toPrecision[i] == "." || toPrecision[i] == ",") { |
|
|
|
toPrecision = toPrecision.slice(0, i); |
|
|
|
break; |
|
|
|
} |
|
|
|
else { |
|
|
|
break; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
this.dom.frame.removeChild(measureCharMajor); |
|
|
|
} |
|
|
|
|
|
|
|
return toPrecision; |
|
|
|
}; |
|
|
|
if (!('titleCharHeight' in this.props)) { |
|
|
|
var textTitle = document.createTextNode('0'); |
|
|
|
var measureCharTitle = document.createElement('div'); |
|
|
|
measureCharTitle.className = 'yAxis title measure'; |
|
|
|
measureCharTitle.appendChild(textTitle); |
|
|
|
this.dom.frame.appendChild(measureCharTitle); |
|
|
|
|
|
|
|
this.props.titleCharHeight = measureCharTitle.clientHeight; |
|
|
|
this.props.titleCharWidth = measureCharTitle.clientWidth; |
|
|
|
|
|
|
|
this.dom.frame.removeChild(measureCharTitle); |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Snap a date to a rounded value. |
|
|
@ -21633,20 +21644,11 @@ return /******/ (function(modules) { // webpackBootstrap |
|
|
|
* @param {Date} date the date to be snapped. |
|
|
|
* @return {Date} snappedDate |
|
|
|
*/ |
|
|
|
DataStep.prototype.snap = function(date) { |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
/** |
|
|
|
* Check if the current value is a major value (for example when the step |
|
|
|
* is DAY, a major value is each first day of the MONTH) |
|
|
|
* @return {boolean} true if current date is major, else false. |
|
|
|
*/ |
|
|
|
DataStep.prototype.isMajor = function() { |
|
|
|
return (this.current % (this.scale * this.majorSteps[this.stepIndex]) == 0); |
|
|
|
DataAxis.prototype.snap = function(date) { |
|
|
|
return this.step.snap(date); |
|
|
|
}; |
|
|
|
|
|
|
|
module.exports = DataStep; |
|
|
|
module.exports = DataAxis; |
|
|
|
|
|
|
|
|
|
|
|
/***/ }, |
|
|
|