@abi-software/map-utilities 1.1.3-beta.0 → 1.1.3-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@abi-software/map-utilities",
3
- "version": "1.1.3-beta.0",
3
+ "version": "1.1.3-beta.1",
4
4
  "files": [
5
5
  "dist/*",
6
6
  "src/*",
package/src/App.vue CHANGED
@@ -38,6 +38,7 @@ const drawnTypes = [
38
38
  { value: "Polygon", label: "Polygon" },
39
39
  { value: "None", label: "None" },
40
40
  ];
41
+ const showConnectivityGraph = ref(false);
41
42
 
42
43
  onMounted(() => {
43
44
  console.log("🚀 ~ onMounted ~ appRef:", appRef.value);
@@ -422,6 +423,25 @@ function changeHover(value) {
422
423
  </el-button>
423
424
  </el-col>
424
425
  </el-row>
426
+ <el-row>
427
+ <el-col>
428
+ <h3>Connectivity Graph</h3>
429
+ </el-col>
430
+ <el-col>
431
+ <el-button
432
+ @click="showConnectivityGraph = true"
433
+ size="small"
434
+ >
435
+ Show connectivity graph
436
+ </el-button>
437
+ <el-button
438
+ @click="showConnectivityGraph = false"
439
+ size="small"
440
+ >
441
+ Hide connectivity graph
442
+ </el-button>
443
+ </el-col>
444
+ </el-row>
425
445
 
426
446
  <DrawToolbar
427
447
  v-show="isFlatmap"
@@ -491,6 +511,11 @@ function changeHover(value) {
491
511
  @setColour="setColour"
492
512
  @checkChanged="checkChanged"
493
513
  />
514
+ <ConnectivityGraph
515
+ v-if="showConnectivityGraph"
516
+ entry="ilxtr:neuron-type-aacar-13"
517
+ map-server="https://mapcore-demo.org/curation/flatmap/"
518
+ />
494
519
  </div>
495
520
  </template>
496
521
 
@@ -508,4 +533,9 @@ function changeHover(value) {
508
533
  top: calc(50% - 100px);
509
534
  left: calc(50% - 200px);
510
535
  }
536
+ .connectivity-graph {
537
+ width: 600px;
538
+ height: 600px;
539
+ margin-top: 1rem;
540
+ }
511
541
  </style>
@@ -106,7 +106,6 @@ export default {
106
106
  }
107
107
  }
108
108
  }
109
- // this.#sourceSelector.innerHTML = sourceList.join('')
110
109
  return firstSource;
111
110
  },
112
111
  setPathList: async function (source) {
@@ -189,7 +189,10 @@ class CytoscapeGraph
189
189
  roots: connectivityGraph.roots
190
190
  },
191
191
  directed: true,
192
- style: GRAPH_STYLE
192
+ style: GRAPH_STYLE,
193
+ minZoom: 0.5,
194
+ maxZoom: 10,
195
+ wheelSensitivity: 0.4,
193
196
  }).on('mouseover', 'node', this.overNode.bind(this))
194
197
  .on('mouseout', 'node', this.exitNode.bind(this))
195
198
  .on('position', 'node', this.moveNode.bind(this))