Maths Graphs?

[Ste Wilson]

I've just had a quick look through Dave's awesome curation bit.ly/tiddlytools for a graphing tool to let me do say y=sin x and get a nice graph but didn't spot anything.

Has any one done anything?

I don't suppose https://latex2js.com/ or http://www.jsgraph.org/ would be easy to pluginify?

Ste

[Ste Wilson]

Think this might be in the blast from the past category but I think this might do what I want!

https://github.com/gt6796c/graph-tw5

[Ste Wilson]

See also

https://gt6796c.github.io/

[Mohammad]

This is amazing! Small and smart!!

On Friday, June 14, 2019 at 1:35:15 PM UTC+4:30, Ste Wilson wrote:

See also

https://gt6796c.github.io/

[@TiddlyTweeter]

On Friday, 14 June 2019 10:59:15 UTC+2, Ste Wilson wrote:

Think this might be in the blast from the past category but I think this might do what I want!

https://github.com/gt6796c/graph-tw5

Its a super achievement in integrating JS libraries. Very elegant. I think its more in the "Gadzooks Batman! Category."

On Friday, 14 June 2019 12:02:12 UTC+2, Mohammad wrote:

This is amazing! Small and smart!!

 

Truly is. 

When it came out it didn't get much notice, which was a shame. 

The Mermaid diagramming part is incredibly flexible. It has a slight problem with text scaling in some cases.

[Ste Wilson]

Dave or other tool maps peeps.. I think they should be added to the list!

[bimlas]

Very useful plugin, thanks!

With a hidden option, we can even display data tiddlers:

- Go to https://gt6796c.github.io/

- Create a new tiddler, name it "Coords" and set type to JSON data (application/json)

- Set the content to "[[3,2],[4,1],[2,5]]"

- Create another tiddler with the content

<$graph>

$tw.wiki.getTiddlerData("Coords")

1/x

Math.sin(x)

</$graph>

The first line causing the magic: it gets the (black) points from "Coords" data tiddler (the other lines are not needed, I just want to show that the `$tw.wiki...` is a same Javascript line as the others).

2019. június 14., péntek 11:05:15 UTC+2 időpontban Ste Wilson a következőt írta:

See also

https://gt6796c.github.io/

[Ste Wilson]

Don't know why I didn't look at your thing before bimlas!  Thats very useful!

Would that method be extendable to say a range slider for say changing a variable....(drams of sliders and real time graph changes)..

[bimlas]

Ste Wilson,

This solution works, but there are several bugs with it:

<$range tiddler="RangeDemo" min="0" max="10" default="5" increment=".01"/> {{RangeDemo}}

<$graph color='blue' thickness='1' minX="0" minY="-6" maxY="6" equation="
Math.sin(x) * parseFloat($tw.wiki.getTiddlerText('RangeDemo'))
"></$graph>

• It can only display one function (equation parameter) because if you enter the statement between the <graph> tags, it will not work for some reason.
• If you modify the slider, the graph will not change, but you will need to close and reopen the tiddler.

[bimlas]

Ste Wilson,

You may be also interested in this:

http://graphs.tiddlyspot.com/

Note: I have no experience with this.

[Ste Wilson]

:D with bugs...that's still pretty damm good!

Thanks!

Going onto and out of edit mode refreshes it too..must be able to get a button for that..

Thanks again.

Ste

[bimlas]

You are right:

<$range tiddler="RangeDemo" min="0" max="10" default="5" increment=".01"/> {{RangeDemo}}

<$list filter="[{RangeDemo}]">

  <$graph color='blue' thickness='1' minX="0" minY="-6" maxY="6" equation="
    Math.sin(x) * parseFloat($tw.wiki.getTiddlerText('RangeDemo'))
  "></$graph>

</$list>

If the value changes, it refreshing the graph.

[Ste Wilson]

You are AMAZING!!!  Thank you!!!!