EVERYONE: Call for showcase projects!

[AlexDM0]

Hi Everyone,

As I've mentioned in #227, we're working on updating the vis website and I'd like to invite you all to submit projects you'd like to have showcased on our website. Any cool project you have made with vis is welcome! If your project is cool but the information in it is classified, you're free to make up new information for it :+1:!

Please include the URL to the project page, or if you'd like us to host the example, let us know how you'd like to be credited. Even an image would be great!

Regards,

Alex

[joaobarcia]

Hi Alex,

I'm working on a collaborative project for which we intend to make intensive use of your library. This one will take some time to be released.

Nevertheless, I am also implementing it in the launch page of our project. It should be ready in a few weeks. Although I might prefer not to show the content until we go public, I think it's only fair to give back some of my time and put some lorem ipsums instead of the original content. When do you need it for?

Cheers

[AlexDM0]

We're in the process of adding a showcase segment on the vis.js website (www.visjs.org) to show what people do with vis. The website will be updated around October so I'm trying to see if there are people willing to showcase what they made.

[mrluka]

Hey Alex, I would like to show the results of my work when it's done, which is planned to be in the next 1-2 month. :) I'm also looking forward to the new website and I really appreciate your work, keep it going :)

[jeroencoumans]

Feel free to add http://tesla.theantworks.com and http://pfizer-az.theantworks.com! These are two case studies I created for a startup that specialises in patent analysis, and were featured on CNN Money, The Guardian, CNBC and the Financial Times.
Both fully use vis.js for graph rendering, while the frontend is built with React.

[jeroencoumans]

Also, here's a more fully functional example of what will soon be released (only screenshots).

[losttheplot]

Cool ...I'm very, very impressed on many levels :)

[ Yes, I know this isn't a forum, but it had to be said. ]

[AlexDM0]

Hi Jeroen, thank you for replying on my twitter message so quickly! Your case studies look very impressive! Its nice to see the static smooth curves and new examples being used :). I'm curious how you did the layout on the last Image :), solved as individual clusters, saves positions, locked x and y and devided by some sort of levelling system?

Would you mind if we'd use some of your colors to integrate in vis? Either in examples or default groups?

Regards,

Alex

[jeroencoumans]

I'm using chroma-js to generate group colours based on the Paired set from ColorBrewer. Check https://vis4.net/blog/posts/mastering-multi-hued-color-scales/ how this works. This allows you to create dynamic colour scales while trying to keep the distinction between each colour as high as possible. So yes, feel free to use those colours as they're open anyway :)

In the last layout, I actually cheated and used Gephi to compute their locations. It shows the relationship between nodes while plotting them in 2 dimensions; in this case time (x) and technology cluster (y).

[AlexDM0]

I see, I'll look into the colors! thanks for that! Maybe it could be a cool addition to vis if you could define seperate subsets of nodes and give them their own origin point (so the gravity would pull them towards that point.). Then ignore the interactions between subsets and you could have something very similar to what you have in the last picture!

Also, @jeroencoumans, the two links you mentioned earlier don't seem to work anymore. http://tesla.theantworks.com and http://pfizer-az.theantworks.com are they relocated somewhere?

Regards,

Alex

[jeroencoumans]

The links are still available at http://theantworks.herokuapp.com/industry-report/tesla/ and http://theantworks.herokuapp.com/industry-report/pfizer-az/

[AlexDM0]

Great, thanks!

[AlexDM0]

@joaobarcia and @mrluka I'm in the process of finalizing the new website. Do you have anything you'd like to show for the showcases?

[AlexDM0]

@jeroencoumans Is there any information available you'd like to share on the upcoming project you have shown with screenshots?

[GluedToTheScreen]

My project is a One Page Web App enabling you to mark spots/segments of podcasts and easily share those highlights with friends. Podcasts are typically mp3 audio files obtained via RSS feed so we have integrated a media player with custom controls. Podcast episodes are presented in sequence over a navigable timeline, which is also used to visualize single episodes and/or highlights playing second by second.

For example, here are many episodes of one podcast... http://www.poddvr.com/?e=6c7b942a2dd07385

... and here is one episode to play: http://www.poddvr.com/?c=6c7b942a2dd07385

Still much to do. This started out with CHAP but moved to vis when I saw the direction of things... just now getting basic functionality solid, but still having issues with timeline items on mobile. In addition to the technical alchemy required to deliver the web tool, we will be promoting a crowd-sourced approach to collecting meta-data (shared marks/segments) and offering it to others.

We'll soon release a discovery front-end, designed to introduce relevant podcast media to more people. There is a VAST resource of related audio, video, text, graphic, and data that we are attempting to assimilate and present in a useful way. You would be amazed at how many hours of great content is available!

vis supports our roadmap, as ambitious as it is, which attests to its flexibility. We continue to be impressed with the quality and frequency of releases as well as support provided by the community.

[AlexDM0]

Hi,

I have added your project to our showcase! thank you for letting us know! If we made a mistake with any of the content relating to your project please let us know so we can fix it asap :)

Regards,

Alex

[joaobarcia]

Hi Alex,

Sorry, we don't have anything "showcasable" but I will let you know as soon as we do! Looking forward to check the new website.

edit: just checked the new website and it's looking quite nice!

Cheers, Joao

[AlexDM0]

Hi Joao,

the new website is live now: http://www.visjs.org ! If you have something you'd like to showcase, I'd be happy to put it on there.

Regards,

Alex

[felixhayashi]

Hi @AlexDM0

I would highly appreciate if you could update the showcase text for Tiddlywiki once you find the time. The original text contained errors and was not really intended to be used as showcase text so I improved it.

Showcase text:

The open-source project TiddlyMap heavily draws on the Vis.js library to turn the personal note-taking software TiddlyWiki into a full-blown concept-mapping tool. Graphs may be embedded in the overall wiki content to accompany the text at any place and clickable nodes allow fast topic navigation. The resulting graph-wiki-hybrid makes it incredibly easy to integrate, link and visualize ideas.

Many thanks!

-Felix

P.S. We just migrated to vis.js v4 :) Especially the loading bar possibility is great for big graphs!!

[AlexDM0]

Hi Felix,

I'll do this next week. You could also make a pull if you'd like?

Glad to hear v4 is running now!

Cheers

[felixhayashi]

Hi @AlexDM0

You could also make a pull if you'd like?

I was completely unaware of the fact that it is possible to make pull requests for the vis.js website here in the repo. That's great, then I'll definitely do a pull requests everytime I spot a mistake in the docs (if you don't mind). Until now, I thought the docs folder at github is auto-generated from php/templates and and only included for the user as read only part of the repo...

That said, where should I make the pull request for the showcase section? Couldn't find it...

-Felix

[AlexDM0]

Hi Felix,

The docs are being kept in the develop branch (which we then copy over to gh-pages at release). As gh-pages does only allow static html and js (no node or php) we have everything as static html (yes it's a pain to work with =]).

gh-pages is the website so there is a showcase folder in there.

https://github.com/almende/vis/tree/gh-pages/showcase

Regards :)

[felixhayashi]

Hi Alex,

The docs are being kept in the develop branch (which we then copy over to gh-pages at release).

Allright. Then I know where to commit next time ;)

gh-pages is the website so there is a showcase folder in there.

I noticed a gh-pages-dev branch. In case of the showcase stuff, should I commit to this branch or directly to the gh-pages?

-Felix

[AlexDM0]

Hi Felix,

Directly to gh pages is fine.

Cheers

[Andrei-Straut]

Hi Alex,

I've used vis for a side-project I was working on, and I have to say it's great, I loved it, and you guys have done an awesome job! :+1: If you can please update the showcase section and include it, I'd very much appreciate it.

The url is http://gaps.azurewebsites.net/ and it is a one-page app that does just what the name says (path searches in graphs using genetic algorithms). Everything that is visually rendered uses vis.js (v3.12, unfortunately I started work a bit before v4, and I didn't want to have to adapt and port versions).

Also, as the site is on the free Azure hosting tier, please note that at times it may have a bit of a latency on page-load. Other than that, if you need more details, I'm happy to provide them to you. Also, GitHub repo is here:

https://github.com/Andrei-Straut/gaps

[josdejong]

wow Andrei, that looks really cool! Thanks for sharing, we will add your app to the showcases page.

[Andrei-Straut]

Thanks Jos, awesome! :smile:

[AlexDM0]

Hi Andrei,

That's a very cool (and feature-wise broad) use of vis! :) We'll add it to the showcase shortly. Any part in particular you'd like as the showcase image?

A small suggestion for improvement: If you highlight the path traveled in the network, would it be cool to make the nodes, edges and labels that are not in the path a bit transparent? Sort of like the neighborhood highlight example on our website.

Regards

[Andrei-Straut]

Hey Alex,

Thanks, can you please use this one?

Thanks, your suggestion is handy and welcome, I think it would give an even better highlight to the selected path. I will implement it later on today or tomorrow, as time allows me

[AlexDM0]

Hi Andrei,

Going by the template we use for images, we'll have to pick one of those. Any preference?

Regards

[Andrei-Straut]

Alex, where can I find the templates? Also, would you prefer taking this conversation by email? (I think every poster here is being notified of this discussion)

[AlexDM0]

Hi Andrei,

That's fine, vis gets a lot of emails, a few more shouldn't matter.

If you just take a look at: http://visjs.org/showcase/index.html

all the images are 900x400px Anything that fits in that size is fine by me :)

Besides, others also benefit from knowing the requirements, seeing your showcase and any tips that may be mentioned :)

Regards

[Andrei-Straut]

Hey Alex,

I've just pushed two images (jpg and png) in 900x400px format. Thanks for the tips, I didn't know the reqs for the showcase pictures.

https://github.com/Andrei-Straut/gaps/commit/1a6dfaa28b75ecb44a9e73a1a7363a4a5630aeeb

Also a suggestion: Maybe this should be somewhere visible, like a short guideline in the Showcase page?

[AlexDM0]

Hi Andrei,

Usually we quickly Photoshop an image together but since you have so many elements, I figured I'd ask. I figure the requirement for keeping the showcase layout consistent would be fairly self explanatory? :)

Regards

[Andrei-Straut]

Hey Alex,

Of course the layout should be consistent, however, if a user provides its own images and he doesn't want them modified (not my case, you can photoshop at will or even use another image / screenshot if you think it's better suited :) ), maybe knowing the size in advance would be useful?

[AlexDM0]

Hi Andrei,

I'll keep it in mind, though I figure web developers should have no problems getting the aspect ratio of an image on a website ;)

[Andrei-Straut]

Hey Alex,

True, no arguing with that :)

Thanks again, you guys are awesome! :+1: