Add Group Functionality to Simple VIS.JS Script

$10-30 USD

Completed

Posted

over 8 years ago

$10-30 USD

Paid on delivery

I am using the timeline function of the [login to view URL] project. You can see the documentation at: [login to view URL] I have the basic example working fine. I am attaching it. I need it modified to create groups. Please modify to create 3 groups. Add 2 items from the Items to each group. Please keep as simple as possible. I will pay a maximum of $20 for this.

Java

JavaScript

Website Design

Project ID: 8331059

About the project

Remote project

Active 9 yrs ago

Looking to make some money?

Email address

Benefits of bidding on Freelancer

Set your budget and timeframe

Get paid for your work

Outline your proposal

It's free to sign up and bid on jobs

Awarded to:

@fam85

Hi inprod I have done what you want <!DOCTYPE HTML> <html> <head> <title>Timeline | Basic demo</title> <style type="text/css"> body, html { font-family: sans-serif; } .red { color: red; } </style> <script src="[login to view URL]"></script> <link href="[login to view URL]" rel="stylesheet" type="text/css" /> </head> <body> <div id="visualization"></div> <script type="text/javascript"> var groups = ([ { id: 1, content: 'Group 1' // Optional: a field 'className', 'style' }, { id: 2, content: 'Group 2' // Optional: a field 'className', 'style' }, { id: 3, content: 'Group 3' // Optional: a field 'className', 'style' } // more groups... ]); // DOM element where the Timeline will be attached var container = [login to view URL]('visualization'); // Create a DataSet (allows two way data-binding) var items = new [login to view URL]([ {id: 1,group:1, content: 'item 1', start: '2013-04-20'}, {id: 2,group:1, content: 'item 2', start: '2013-04-14'}, {id: 3,group:2, content: 'item 3', start: '2013-04-18'}, {id: 4, group:2,content: 'item 4', start: '2013-04-16', end: '2013-04-19'}, {id: 5, group:3, content: 'item 5', start: '2013-04-25'}, {id: 6, group:3, content: 'item 6', start: '2013-04-27'} ]); // Configuration for the Timeline var options = {}; // Create a Timeline var timeline = new [login to view URL](container, items,groups, options); </script> </body> </html>

$20 USD in 0 day