# Hooking into SVG events and connecting to other cells
**URL:** https://talk.observablehq.com/t/hooking-into-svg-events-and-connecting-to-other-cells/4523
**Category:** Help
**Created:** [January 25, 2021, 8:12pm UTC](https://talk.observablehq.com/t/hooking-into-svg-events-and-connecting-to-other-cells/4523 "2021-01-25T20:12:24Z")
**Posts on this page:** 3
**Page:** 1
### Author:  [@ThaineNorris](https://talk.observablehq.com/u/ThaineNorris)
#### Post date: [January 25, 2021, 8:12pm UTC](https://talk.observablehq.com/t/hooking-into-svg-events-and-connecting-to-other-cells/4523/1 "2021-01-25T20:12:24Z")
I am totally new to Observable. Forgive me for what may be a simple question that is documented elsewhere, but I am unable to find an answer.
I have made a fork of the hierarchical edge bundling graph here: [Biographical Influences / thainenorris / Observable (observablehq.com)](https://observablehq.com/@thainenorris/hierarchical-edge-bundling)
I would like to display the hierarchical tree data in a cell outside the graph when the user clicks on one of the labels. I can see how the mouse enter and leave events are handled within the graph code itself, but I do not know how I could hook an event up within the graph code that would talk to another Observable cell or expose data to it.
Any guidance would be most appreciated!
---
### Author:  [@mootari](https://talk.observablehq.com/u/mootari)
#### Post date: [January 25, 2021, 8:43pm UTC](https://talk.observablehq.com/t/hooking-into-svg-events-and-connecting-to-other-cells/4523/2 "2021-01-25T20:43:16Z")
There are two options that utilize keywords which are unique to Observable:
### 1. `mutable`
Define a [mutable](https://observablehq.com/@observablehq/introduction-to-mutable-state) cell:
```javascript
mutable clickedData = undefined
```
Then in your chart’s click handler, assign the node data to the mutable cell:
```javascript
function overed(event, d) {
// If we want to reassign the cell value, the name
// has to be prefixed with "mutable" again.
mutable clickedData = d;
}
```
### 2. viewof
Your cell can have both a DOM output _and_ a value, if you prefix it with [viewof]. You can update the view’s value this way:
```javascript
viewof chart = {
// ...
const view = svg.node();
function overed(event, d) {
// For viewof cells, Observable's engine (the "Runtime"), checks the "value" property.
view.value = d;
// This tells Observable that the cell has a new value.
view.dispatchEvent(new Event("input"));
}
return view;
}
```
The value can be referenced in another cell by leaving out the “viewof”:
```javascript
clickedData = chart
```
Note that you don’t have to name this cell. Instead you could also simply create a cell containing
```javascript
chart
```
to display the value.
---
### Author:  [@ThaineNorris](https://talk.observablehq.com/u/ThaineNorris)
#### Post date: [January 26, 2021, 1:12am UTC](https://talk.observablehq.com/t/hooking-into-svg-events-and-connecting-to-other-cells/4523/3 "2021-01-26T01:12:18Z")
Thank you! I think this has helped me get under way.