I'm using the GoJS library in React through integration React GoJS , so I can create a diagram in a very simple way, as stated in the example:
<GojsDiagram
diagramId="myDiagramDiv"
model={this.props.model}
createDiagram={this.createDiagram}
className="myDiagram"
onModelChange={this.modelChangedhandler}
/>
where my createDiagram()
method is responsible for creating my diagram (note typing, since I'm using TS. Diagram
is a class of the library itself)
private createDiagram: Diagram {
const _diagram = ...
return _diagram;
}
My problem is programmatically zooming in my diagram. To do this, I need to access the _diagram
object I created, as described here , such as _diagram.CommandHandler.increaseZoom()
. The point is that my object does not exist. I've already tried instantiating it as an attribute of the class and supplying it as props
of component GojsDiagram
, but I'm stuck in a typing problem. I already tried to set this same attribute within the createDiagram
method, but when deploying the zoom, nothing happens.
Looking at the source code of the component, I saw that the diagram I want is instantiated:
class GojsDiagram<N extends BaseNodeModel, L extends LinkModel> extends React.PureComponent<GojsDiagramProps<N, L>> {
private myDiagram: Diagram; <-- aqui!
private modelChangedHandlers = [
new AddNodeModelChangedHandler<N, L>(),
...
Is there any way to access this object and execute a method of it? Is there any other way to solve this problem?