More than one instance / "widget" environment

38 views
Skip to first unread message

Jeff

unread,
Oct 11, 2009, 8:13:13 AM10/11/09
to JavaScript Information Visualization Toolkit
Hi all,

Just start to play with JIT, really nice work.

I want to create a visual debug tools integrated in the Javascript
framework I'm working on, to navigate throught object, classes, data
etc ... the tree will be generated by exploring the code but i'm stuck
for the visualization part.

I have some issues to fit my needs, by looking some other post and the
jit source, it seems the toolkit is not designed to run multiple
instance on the same page. In a "widget environment", more than one
instance or any manipulation attempt I tried, like drag & drop / show
& hide, crash the visualization : label disappear, event lost ...

Of course page refresh is not an acceptable solution :-)

Do you have any work in progress to solve theses problems ?

Cheers,

Jeff

Tim Bunce

unread,
Oct 11, 2009, 3:04:59 PM10/11/09
to javascript-information...@googlegroups.com
On Sun, Oct 11, 2009 at 05:13:13AM -0700, Jeff wrote:
>
> I have some issues to fit my needs, by looking some other post and the
> jit source, it seems the toolkit is not designed to run multiple
> instance on the same page.

I'd just like to add my support for the need to enable multiple
visualizations on a page.

Tim.

Nico Garcia Belmonte

unread,
Oct 13, 2009, 5:27:14 PM10/13/09
to javascript-information...@googlegroups.com
Hi,

I'm not sure what you mean by "multiple instances". You should be able to create multiple visualizations on the same page without problems. Here's an example:


However you can't create multiple visualizations in the same Canvas Widget, unless one visualization is used for node rendering purposes like in these examples:



In most cases you don't need to draw two or more visualizations in the same Canvas Widget, unless they interact with each other in some particular way. The usual approach for drawing multiple visualizations on the same page would be to create multiple Canvas Widgets or to add one visualization as node rendering method for another visualization.

Hope it helps,
--
I would never die for my beliefs because I might be wrong.

Bertrand Russell

venkatesh kavuluri

unread,
Oct 13, 2009, 10:16:19 PM10/13/09
to javascript-information...@googlegroups.com
Hi Nico,

I created two canvas widgets on the same page each with a different space tree. But, when I click on a node of tree-1 (in canvas-1), it is disturbing the tree-2 (in canvas-2) as well. Maybe I was not implementing the canvas instance separation  properly. Is there any thing in particular we need to take care of to insulate the two trees !

Thank You.
Venkat

Nico Garcia Belmonte

unread,
Oct 14, 2009, 2:51:48 AM10/14/09
to javascript-information...@googlegroups.com
Hi,

Yes, you need to assign unique ids for the two JSON tree instances. You're probably using the same JSON tree for the two visualizations, or the JSON structure  for those two visualizations share the same ids.
I will try to make easier to work with the same JSON structure on multiple canvas widgets, but for the only constraint is that you have to have unique ids for both canvas widgets.

Tim Bunce

unread,
Oct 15, 2009, 7:18:33 AM10/15/09
to javascript-information...@googlegroups.com
On Tue, Oct 13, 2009 at 11:27:14PM +0200, Nico Garcia Belmonte wrote:
> Hi,
> I'm not sure what you mean by "multiple instances". You should be able to create multiple visualizations
> on the same page without problems. Here's an example:
> [1]http://thejit.org/Jit/Examples/Other/example1.html

Thanks. Last time I tried was with treemaps and an old version of the code.
It's possible something has been fixed since, and/or probable that I was
doing something dumb.

Tim.

> However you can't create multiple visualizations in the same Canvas Widget, unless one visualization is
> used for node rendering purposes like in these examples:
> [2]http://thejit.org/Jit/Examples/Other/example2.html
> [3]http://thejit.org/Jit/Examples/Other/example3.html
> In most cases you don't need to draw two or more visualizations in the same Canvas Widget, unless they
> interact with each other in some particular way. The usual approach for drawing multiple visualizations
> on the same page would be to create multiple Canvas Widgets or to add one visualization as node
> rendering method for another visualization.
> Hope it helps,
> On Sun, Oct 11, 2009 at 9:04 PM, Tim Bunce <[4]Tim....@pobox.com> wrote:
>
> On Sun, Oct 11, 2009 at 05:13:13AM -0700, Jeff wrote:
> >
> > I have some issues to fit my needs, by looking some other post and the
> > jit source, it seems the toolkit is not designed to run multiple
> > instance on the same page.
>
> I'd just like to add my support for the need to enable multiple
> visualizations on a page.
> Tim.
>
> --
> I would never die for my beliefs because I might be wrong.
>
> Bertrand Russell
>
> >
> References
>
> Visible links
> 1. http://thejit.org/Jit/Examples/Other/example1.html
> 2. http://thejit.org/Jit/Examples/Other/example2.html
> 3. http://thejit.org/Jit/Examples/Other/example3.html
> 4. mailto:Tim....@pobox.com

venkatesh kavuluri

unread,
Oct 15, 2009, 12:33:10 PM10/15/09
to javascript-information...@googlegroups.com
That works! Thanks a lot for the suggestion!

Ajay Ranipeta

unread,
Oct 21, 2009, 8:28:48 AM10/21/09
to JavaScript Information Visualization Toolkit
Hi,

I believe i've done something similar to what Nico suggested,
different id/instances. But it still doesn't seem to work. Unless i'm
missing something obvious. Any hints/tips?

Example here: http://aggregatedsolutions.com/dev/tree/m2_tree.html

Cheers,
Ajay


On Oct 14, 5:51 pm, Nico Garcia Belmonte <phil...@gmail.com> wrote:
> Hi,
>
> Yes, you need to assign unique ids for the two JSON tree instances. You're
> probably using the same JSON tree for the two visualizations, or the JSON
> structure  for those two visualizations share the same ids.
> I will try to make easier to work with the same JSON structure on multiple
> canvas widgets, but for the only constraint is that you have to have unique
> ids for both canvas widgets.
>
> On Wed, Oct 14, 2009 at 4:16 AM, venkatesh kavuluri <
>
>
>
> venkatesh.kowl...@gmail.com> wrote:
> > Hi Nico,
>
> > I created two canvas widgets on the same page each with a different space
> > tree. But, when I click on a node of tree-1 (in canvas-1), it is disturbing
> > the tree-2 (in canvas-2) as well. Maybe I was not implementing the canvas
> > instance separation  properly. Is there any thing in particular we need to
> > take care of to insulate the two trees !
>
> > Thank You.
> > Venkat
>
> > On Tue, Oct 13, 2009 at 2:27 PM, Nico Garcia Belmonte <phil...@gmail.com>wrote:
>
> >> Hi,
>
> >> I'm not sure what you mean by "multiple instances". You should be able to
> >> create multiple visualizations on the same page without problems. Here's an
> >> example:
>
> >>http://thejit.org/Jit/Examples/Other/example1.html
>
> >> However you can't create multiple visualizations in the same Canvas
> >> Widget, unless one visualization is used for node rendering purposes like in
> >> these examples:
>
> >>http://thejit.org/Jit/Examples/Other/example2.html
>
> >>http://thejit.org/Jit/Examples/Other/example3.html
>
> >> In most cases you don't need to draw two or more visualizations in the
> >> same Canvas Widget, unless they interact with each other in some particular
> >> way. The usual approach for drawing multiple visualizations on the same page
> >> would be to create multiple Canvas Widgets or to add one visualization as
> >> node rendering method for another visualization.
>
> >> Hope it helps,
>

Nico Garcia Belmonte

unread,
Oct 21, 2009, 9:23:20 AM10/21/09
to javascript-information...@googlegroups.com
Hi,

Your two json structures have nodes with the same ids:

"length": 0,
"data": {},
"name": "1___",
"id": 1,


the id:1 is in both the json and the json2 structure. You need to get
unique ids for each node of the union of both trees.

Ajay Ranipeta

unread,
Oct 21, 2009, 11:25:58 AM10/21/09
to JavaScript Information Visualization Toolkit
doh!. I knew it was something simple.

Thanks Nico

Cheers,
Ajay


On Oct 22, 12:23 am, Nico Garcia Belmonte <phil...@gmail.com> wrote:
> Hi,
>

Jeff

unread,
Oct 21, 2009, 12:51:35 PM10/21/09
to JavaScript Information Visualization Toolkit
Hi,

Sorry for my late reply, thanks everyone for your support and your
feedback ;-)

I had the same problem than you, Ajay, identical id in both json
structure. I have changed the id
by a relative contener id, all works fine. Even so it's strange, as I
have the Json structure in different
scope, i haven't thought about an id conflict.

I still have something to solve, I'm able to open / close multiple
visualization but something
is wrong if I try to reload the widget, a conflict somewhere again and
I am loosing labels and events.

In a close process, I destroy totally my widget object, recursively,
has my visualization is in
the same scope all is destroyed and I can open a new one without
problem.

A reload process is different, the widget object is not destroyed so I
have to take care manually
about specific objects such as JIT. ( Idea : It will be nice to have a
JIT destroy method ).

Nico, special thanks for your amazing support !!!!

Regards,

Jeff






Reply all
Reply to author
Forward
0 new messages