add d3 data formatting & update map view with two links repr

src/pages/Map.vue

@@ -1,14 +1,17 @@
 <template>
   <div id="map">
-    <node-map v-if="data" :data="data" />
-    <div>
-      {{ data }}
-    </div>
+    <node-map class="node-map" v-if="data" v-bind="one" />
+    <node-map
+      class="node-map" v-if="data2" v-bind="two"
+      id="ùmqsldùml"
+    />
   </div>
 </template>
 
 <script>
+import { toSingleManyData, toManyManyData } from '@/helpers/d3Data'
 import NodeMap from '@/components/NodeMap'
+
 export default {
   name: 'Home',
 
@@ -18,14 +21,22 @@ export default {
 
   data () {
     return {
-      text: null,
-      data: null
+      id: 39,
+      data: null,
+      data2: null,
+      one: { nodes: null, links: null },
+      two: { nodes: null, links: null }
     }
   },
 
   created () {
-    this.$store.dispatch('GET_TREE', 17).then((data) => {
+    this.$store.dispatch('GET_TREE', this.id).then((data) => {
       this.data = data
+      this.one = toSingleManyData(data)
+    })
+    this.$store.dispatch('GET_TREE', this.id).then((data) => {
+      this.data2 = data
+      this.two = toManyManyData(data)
     })
   }
 }
@@ -35,5 +46,10 @@ export default {
 #map {
   height: 100%;
   width: 100%;
+  display: flex;
+  flex-basis: 50%;
+}
+.node-map {
+  width: 50vw;
 }
 </style>