title: vis.js/Javascript/React: Getting groups from database
body: <p>I am currently using REACT as my frontend and accessing data from a Neo4j DB.  Also, I am using vis.js to render a timeline of events.  Currently, I am trying to figure out the best way to display my data in groups in the REACT UI.  Most of the vis.js examples that I have seen use static data in the code.  I also reviewed the vis.js documentation but it was not helpful. Heads up I am new to REACT/JS.</p>
  
  <p>Right now, the following code is displaying all the data on the screen.</p>
  
  <pre><code>const nArray = data.abs.map((abs, index) =&gt; ({id: index + 1, content: abs.Des[0], start: abs.time, title: abs.Trace, end: null, group: 1}))
  
  const groups = ([{id: 1, content: 'Prog'}])
  
      &lt;div className="timeline"&gt;
          &lt;Timeline 
              groups={groups}
              items={nArray}
              options={options}
              container={container}
            /&gt;;
      &lt;/div&gt;
  </code></pre>
  
  <p>In my DB I have 4 types of nodes and right now they are all being displayed in the one group, <code>Prog</code>.  I would like to display the 4 groups of nodes in their own respective groups on the timeline using vis.js but I am not sure how to filter the data using the map function or if that is the best solution. Any suggestions on how to tackle this problem would be greatly appreciated. </p>