add javascript functions / lib to TW

137 views
Skip to first unread message

okido

unread,
Aug 28, 2012, 2:46:49 PM8/28/12
to tiddly...@googlegroups.com
Hello TW Guru's,

I would like to add a library with some functions for calculating mean, stdev etc.
So functions that are stored in a systemConfig tiddler that can be called from within Inlinejavescript code in any other tiddler.

What is the general framework to start with for such a systemConfig tiddler ?

Thanks, Okido

PMario

unread,
Aug 29, 2012, 9:20:04 AM8/29/12
to TiddlyWikiDev
On Aug 28, 8:46 pm, okido <bkn...@gmail.com> wrote:
> I would like to add a library with some functions for calculating mean,
> stdev etc.
Do you think of a special library, or is it one, you wrote?
-m

okido

unread,
Aug 29, 2012, 11:55:05 AM8/29/12
to tiddly...@googlegroups.com
HI Pmario,

I am thinking about jStat.js en psMathStats. jStat uses the flot.js lib, I would preferably use one of the two libs mentioned here below.
My use case is to analyse datasets and draw graphs, this is done with d3.js or highchart/stocks.js that both function as lib in TW.
CSV files are imported as tiddlers and the columns are cooked to an array.
The array is than used as input for the graph script that runs with inlinejavascript and presents the graph in a tiddler.
To get nice prints I export the *.js and an index.htm file with the graphs/text and either print it to paper or as pdf.

Any help would be nice, Okido



Op dinsdag 28 augustus 2012 20:46:49 UTC+2 schreef okido het volgende:

PMario

unread,
Aug 31, 2012, 4:16:58 AM8/31/12
to TiddlyWikiDev
Hi Okido,
Some links would have speed up the response a lot.

I had a short look to the resources I found with a / several google
search(es). So I may have land at the wrong spots. but anyway

On 29 Aug., 17:55, okido <bkn...@gmail.com> wrote:
> I am thinking about jStat.js en psMathStats. jStat uses the flot.js lib, I
http://www.jstat.org/
there is no API documentation at http://www.jstat.org/documentation so
to find out how it works, you'll need to look at the source code.
Hmmm...

http://code.google.com/p/flot/downloads/detail?name=flot-0.6.zip&can=2&q=
seems, there is no development anymore.

> would preferably use one of the two libs mentioned here below.
If I understand this right, you'd prefer d3.js or highchart/stocks.js.
right?

d3.js is a very new "low level / extremely powerfull" library, which
imo can be used to create "high level" libraries, like highchart.
but ....
you'll have to do a lot on your own.

see: https://github.com/mbostock/d3/wiki/Gallery near the end of the
page is the "Libraries" section, where nvd3.com http://novus.github.com/nvd3/
is my faforite. It is quite young too, but imo has a lot of potential.
(the focus of the creators http://www.novus.com/ seems to be stock
data too :)

> My use case is to analyse datasets and draw graphs, this is done with d3.js
> or highchart/stocks.js that both function as lib in TW.
IMO it depends a lot on your data.

If you have to deal with stock data highchart/stocks.js would be a
good choice, because there charts seem to be specialiced for this type
of data.

If you have a different dataset. d3.js have a lot of examples (https://
github.com/mbostock/d3/wiki/Gallery) but as mentioned allready, it is
quite low level. So there will be a lot of programming involved.

> CSV files are imported as tiddlers and the columns are cooked to an array.
> The array is than used as input for the graph script that runs with
> inlinejavascript and presents the graph in a tiddler.
> To get nice prints I export the *.js and an index.htm file with the
> graphs/text and either print it to paper or as pdf.
>
> Any help would be nice, Okido

As I wrote. Your data is key.

http://www.jstat.org can be used without the plotting library. So you
can use it to create your dataset to be drawn with an other
library. ... I personally would search for a math library with better
documentation and development going on. Otherwise you may end up
fixing the library too.

If a charting library creates some type of SVG diagram, it would be
easy to save the resulting diagram as a svg tiddler. This tiddler
could be used with the <<image>> macro inside any other tiddler. .....
So printing it with high quality would be possible ...

====

Some time ago I did a short proof of concept [1] with jsxgraph [3]
library which imo is great, if you need interactive charts. (I do like
the interactive nature a lot :)

The showcases [2] are quite impressive and the theorethical /
scientific background of the library should be OK. The size is about
100kByte (only) ... I'm not sure about printing here

====

Conclusion:

d3.js is very powerfull but much work to do on your own.
nvd3 library uses d3.js looks promising but is quite new.
highchart/stocks.js looks good for stock data. print is for the chart
only.
jsxgraph is good for interactive charts, for users to play with.

The way, to include those into TW / TiddlySpace will be very similar
to all of them. The way using them highly depends on the different
APIs the libraries are using.

hope this helps
mario

[1] http://jsxgraph.tiddlyspace.com/
[2] http://jsxgraph.uni-bayreuth.de/wiki/index.php/Showcases
[3] http://jsxgraph.uni-bayreuth.de/wp/

okido

unread,
Sep 1, 2012, 5:14:01 AM9/1/12
to tiddly...@googlegroups.com
HI Pmario,

Thanks for your extensive post.
Sorry for not providing the links.
d3.js is used by me in TW, but indeed it needs rather much coding.
I use it only for special things, at the moment for a heat map that shows the performance of departments.
The novus lib is tried by me I could not get it to work in TW.
JSXGraph works fine and the graphs are nice, I tried it some time ago and will have an other look at it.
Highcharts is usable in TW and the graphs are nice with little coding.

Than the jstat and psMathstat, I looked at these because I needed to do some calculations on arrays, like mean, max and preferable some stat functions to calculate histograms.
The documentation on these two libs is very little so I got the idea to just make a plugin with the functions I need.
There a ran into problems because I did not now how to make a function available in whole TW from a plugin, I figured it out now.
I will have a quick look for a math plugin else I will make my own plugin for the functions I need now.
Your tip regarding an SVG tiddler I will certainly explore a little more.

Thanks very much for your effort, Okido




Op dinsdag 28 augustus 2012 20:46:49 UTC+2 schreef okido het volgende:
Hello TW Guru's,

PMario

unread,
Sep 1, 2012, 11:15:46 AM9/1/12
to TiddlyWikiDev

PMario

unread,
Sep 1, 2012, 11:18:06 AM9/1/12
to TiddlyWikiDev

okido

unread,
Sep 20, 2012, 1:28:28 PM9/20/12
to tiddly...@googlegroups.com
Hi PMario,

I checked JSX and it is certainly a gem.
Along the way I also found some other libs that will certainly reduce coding, libs like sugar , underscore , crossfilter.
In combination with Highcharts and d3.js it makes TW a very nice tool to make graphs from large data sets.

Thanks a lot, Okido

Op zaterdag 1 september 2012 17:18:07 UTC+2 schreef PMario het volgende:
http://jsxgraph.uni-bayreuth.de/docs/files.html
one more

PMario

unread,
Sep 20, 2012, 5:24:39 PM9/20/12
to TiddlyWikiDev
On Sep 20, 7:28 pm, okido <bkn...@gmail.com> wrote:
> I checked JSX and it is certainly a gem.
> Along the way I also found some other libs that will certainly reduce
> coding, libs like sugar <http://sugarjs.com/> , underscore<http://underscorejs.org/>,
yup,
but be aware, that they may interfere / overlap with each other ...
even if they say, they don't. So some testing and reading the docs
will be needed, to be sure.
... jQuery is also part of TW.

eg: Object merge function seems to be there in all of them :/ So try
to use as view libraries as possible. Have a look at TW core and
jQuery first. IMO adding too many libs, will make it more complicated,
since you "buy" a lot of overhead / complexity too ...

TiddlyWiki core also does some tweaking of native javascript objects.
So you'll need to have a look there first. ...

https://github.com/pmario/tiddlywiki/blob/master/js/Dates.js
https://github.com/pmario/tiddlywiki/blob/master/js/Numbers.js
https://github.com/pmario/tiddlywiki/blob/master/js/Strings.js
IMO array.prototype is tweaked too, but I don't find the link :)

> crossfilter <http://square.github.com/crossfilter/>.
> In combination with Highcharts <http://www.highcharts.com/> and d3.js<http://d3js.org/>it makes TW a very nice tool to make graphs from large data sets.
right,
IMO highcharts.js and d3.js are overlapping quite a lot. As I wrote in
my (long) post.

Toughts:
- If I would have enough time to learn, I'd go with d3.js and libs
that use d3.js as a core.
- If I need fast results I'd go with highcharts.js.

crossfilter.js seems to add new functions, without overlapping :))

have fun!
mario
Reply all
Reply to author
Forward
0 new messages