Commit 99b7923c authored by MichaelZinsmaier's avatar MichaelZinsmaier

added basic support for Date (if Y and or X data is a Date .getTime() is automatically called)

however to detect the need of a conversion only the first entry in the data array is checked
and the conversion is not really efficient.
parent 46ab621f
...@@ -37,7 +37,6 @@ ...@@ -37,7 +37,6 @@
This is version 0.1 of curvedLines so it will probably not work in every case. However This is version 0.1 of curvedLines so it will probably not work in every case. However
the basic form of use descirbed next works (: the basic form of use descirbed next works (:
Feel free to further improve the code Feel free to further improve the code
____________________________________________________ ____________________________________________________
...@@ -47,33 +46,31 @@ ...@@ -47,33 +46,31 @@
var d1 = [[5,5],[7,3],[9,12]]; var d1 = [[5,5],[7,3],[9,12]];
var options = { series: { curvedLines: { active: true }}}; var options = { series: { curvedLines: { active: true }}};
$.plot($("#placeholder"), [{data = d1, curvedLines: { show: true}}], options); $.plot($("#placeholder"), [{data = d1, curvedLines: { show: true}}], options);
_____________________________________________________ _____________________________________________________
options: options:
_____________________________________________________ _____________________________________________________
fill: bool true => lines get filled fill: bool true => lines get filled
fillColor: null or the color that should be used for filling fillColor: null or the color that should be used for filling
active: bool true => plugin can be used active: bool true => plugin can be used
show: bool true => series will be drawn as curved line show: bool true => series will be drawn as curved line
fit: bool true => forces the max,mins of the curve to be on the datapoints fit: bool true => forces the max,mins of the curve to be on the datapoints
lineWidth: int width of the line lineWidth: int width of the line
curvePointFactor int defines how many "virtual" points are used per "real" data point to curvePointFactor int defines how many "virtual" points are used per "real" data point to
emulate the curvedLines emulate the curvedLines
fitPointDist: int defines the x axis distance of the additional two points that are used fitPointDist: int defines the x axis distance of the additional two points that are used
to enforce the min max condition. (you will get curvePointFactor * 3 * |datapoints| to enforce the min max condition. (you will get curvePointFactor * 3 * |datapoints|
"virtual" points if fit is true) "virtual" points if fit is true)
*/ */
/* /*
* v0.1 initial commit * v0.1 initial commit
* v0.15 negative values should work now (outcommented a negative -> 0 hook hope it does no harm) * v0.15 negative values should work now (outcommented a negative -> 0 hook hope it does no harm)
* v0.2 added fill option (thanks to monemihir) and multi axis support (thanks to soewono effendi) * v0.2 added fill option (thanks to monemihir) and multi axis support (thanks to soewono effendi)
* *
* *
*/ */
...@@ -131,14 +128,45 @@ ...@@ -131,14 +128,45 @@
ctx.fillStyle = c.toString(); ctx.fillStyle = c.toString();
} }
ctx.lineWidth = series.curvedLines.lineWidth; ctx.lineWidth = series.curvedLines.lineWidth;
var points, dataX, dataY, data;
//convenience check for x or y values if they are Dates if so apply .getTime()
//only check on first value mixing numeric and Date fields in one input array is not allowed
if (series.data[0][0] instanceof Date || series.data[0][1] instanceof Date) {
data = series.data.map(getTimeFromDate);
} else {
//default case
data = series.data;
}
var points = calculateCurvePoints(series.data, series.curvedLines); var points = calculateCurvePoints(data, series.curvedLines);
plotLine(ctx, points, axisx, axisy, series.curvedLines.fill); plotLine(ctx, points, axisx, axisy, series.curvedLines.fill);
ctx.restore(); ctx.restore();
} }
} }
} }
//helper method that convertes Dates to a numeric representation
function getTimeFromDate(timeElement) {
var xVal = timeElement[0];
var yVal = timeElement[1];
var ret = new Array;
if (timeElement[0] instanceof Date) {
ret[0] = xVal.getTime();
} else {
ret[0] = xVal;
}
if (timeElement[1] instanceof Date) {
ret[1] = yVal.getTime();
} else {
ret[1] = yVal;
}
return ret;
}
//nearly the same as in the core library //nearly the same as in the core library
//only ps is adjusted to 2 //only ps is adjusted to 2
function plotLine(ctx, points, axisx, axisy, fill) { function plotLine(ctx, points, axisx, axisy, fill) {
...@@ -231,7 +259,7 @@ ...@@ -231,7 +259,7 @@
} }
//no real idea whats going on here code mainly from https://code.google.com/p/flot/issues/detail?id=226 //no real idea whats going on here code mainly from https://code.google.com/p/flot/issues/detail?id=226
//I don't understand what nergal computes here and to be honest I didn't even try //if fit option is selected additional datapoints get inserted before the curve calculations in nergal.dev s code.
function calculateCurvePoints(data, curvedLinesOptions) { function calculateCurvePoints(data, curvedLinesOptions) {
var num = curvedLinesOptions.curvePointFactor * data.length; var num = curvedLinesOptions.curvePointFactor * data.length;
...@@ -358,4 +386,3 @@ ...@@ -358,4 +386,3 @@
}); });
})(jQuery); })(jQuery);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment