A plugin renderer for jqPlot to draw a Hermite spline.

274 views
Skip to first unread message

krypin

unread,
Nov 28, 2009, 2:58:59 PM11/28/09
to jqplot-users
Hi everyone,

I've created a plugin which draws series as a cubic Hertmite spline.

Example and download here http://creativeinaction.com/jqplot-hermite-spline.php

Feel free to use it in any way u like!

Chris Leonello

unread,
Dec 9, 2009, 9:49:54 PM12/9/09
to jqplot-users
Excellent work!

If some of you are wondering, this plugin provides a method for
visually smoothing the data. The cubic hermite spline (or cspline) is
a method of data interpolation. Splines have many uses in numerical
analysis besides smoothing out plotted data.

Thanks krypin!

On Nov 28, 2:58 pm, krypin <kry...@gmail.com> wrote:
> Hi everyone,
>
> I've created a plugin which draws series as a cubic Hertmite spline.
>
> Example and download herehttp://creativeinaction.com/jqplot-hermite-spline.php

Bjørn Hjelle

unread,
Dec 17, 2009, 6:13:40 AM12/17/09
to jqplot-users
Hi,

I think there may be an issue with this plugin.

If you try to plot two data series, no lines are drawn if the first
data series has only one point.
If the data series with only one point is listed after the one with
more than one point, then the line representing the first data series
is drawn correctly.

Example:

This works fine, both data series has more than one point:

<div id="id64" style="height:300px;width:500px; "></div>
<script type="text/javascript">
var series = [[[1980, 30.0], [1982, 50.0]], [[1979, 50.0],
[1982, 50.0], [1983, 60.0]]];
var options = {"seriesDefaults": {"renderer":
$.jqplot.hermiteSplineRenderer}};
plot1 = $.jqplot('id64', series, options);
</script>

This does not work (no lines are drawn):

<div id="id64" style="height:300px;width:500px; "></div>
<script type="text/javascript">
var series = [[[1980, 30.0]], [[1979, 50.0], [1982, 50.0],
[1983, 60.0]]];
var options = {"seriesDefaults": {"renderer":
$.jqplot.hermiteSplineRenderer}};
plot1 = $.jqplot('id64', series, options);
</script>

Thanks,
Bjørn

On Dec 10, 3:49 am, Chris Leonello <chris.leone...@gmail.com> wrote:
> Excellent work!
>
> If some of you are wondering, this plugin provides a method for

> visually smoothing the data.  The cubic hermitespline(or cspline) is

tinuzz

unread,
Jan 8, 2010, 6:24:07 AM1/8/10
to jqplot-users
Hi,

I made some changes to the plugin to make it work for me. Maybe this
will help others as well. I would post a complete diff, but due to
indentation changes, that gets a little big. A diff-like summary
instead:

Only mangle the dataseries if gd.length > 1, otherwise leave it alone
and just draw it.

if (gd.length) {
if (showLine) {
+ if (gd.length > 1) {
var newGD = [];


gd = newGD;
+ }
this.renderer.shapeRenderer.draw(ctx, gd, opts);

And at the top, do not override the default LineRenderer's draw
method, because this causes errors when the js file is included, but
the renderer is not set on the series. This bug also prevents
conditional use of the hermiteSplineRenderer, because merely including
the js file breaks the default line renderer. The following fixes
that:

- $.jqplot.LineRenderer.prototype.draw = function(ctx, gd, options)
{
+ $.jqplot.hermiteSplineRenderer.prototype.draw = function(ctx, gd,
options) {


I hope this helps,
Martijn.

tinuzz

unread,
Jan 8, 2010, 5:16:03 AM1/8/10
to jqplot-users
Hi,

> I think there may be an issue with this plugin.
>
> If you try to plot two data series, no lines are drawn if the first
> data series has only one point.
> If the data series with only one point is listed after the one with
> more than one point, then the line representing the first data series
> is drawn correctly.

I have run into this as well. The plugin actually causes an error, if
the data series has only one data point. Even if there's only one
series, it doesn't work. Rendering stops at the error, so if you
specify a 'correct' data series before a series with only one point,
the correct series will be rendered just fine.

The error is:

t[0] is undefined
jquery.jqplot.min.js
Line 14
jqplot.hermiteSplineRenderer.js
Line 80

which reads:
this.renderer.shapeRenderer.draw(ctx, gd, opts);

I haven't tried with a non-minified version of jQplot, so this is
about all the information I have.

I actually want to use this on data, that I collect over time (1 data
point each month) and I'd like to graph over 1-year periods. Every
year, I collect my first datapoint of a new series in January. Now, I
have to wait until February before I can see my graphs again ;-)

Hope this helps,
Martijn.

Bjørn Hjelle

unread,
Jan 26, 2010, 5:43:08 AM1/26/10
to jqplot-users
Martijn, thanks, that works great!
With these changes the plugin also works in combination with the
trendline plugin.

Thanks a lot!

Bjørn

On Jan 8, 12:24 pm, tinuzz <martijngrendel...@gmail.com> wrote:
> Hi,
>
> I made some changes to the plugin to make it work for me. Maybe this
> will help others as well. I would post a complete diff, but due to
> indentation changes, that gets a little big. A diff-like summary
> instead:
>

krypin

unread,
Feb 13, 2010, 8:45:53 AM2/13/10
to jqplot-users
Thanks Martijn!

I've added your changes to the code and posted it on
http://blog.statscollector.com/archives/6

Great job! Thanks!

Reply all
Reply to author
Forward
0 new messages