How to use the Overview correctly?

Hi All,

I am trying to use the overview diagram in conjunction with my diagram.

However when ever I set the overview.observed property, I start getting errors in the console (I’m using Chrome)

Uncaught Error: Shape.strokeWidth must be a real number and not NaN or Infinity: Infinity go-debug.js:20
u.g go-debug.js:20
u.i go-debug.js:21
u.defineProperty.lz go-debug.js:920
$i go-debug.js:702
Yi.hs go-debug.js:702
si go-debug.js:597
$g go-debug.js:586
(anonymous function) go-debug.js:586

I haven’t set anything yet when I get this error, and the call stack indicates it is not coming from my code.

Any suggestions on how I can debug this and see what property on my main diagram is causing this issue?

Thanks.

Jonathan

Hi. What do you mean by “I haven’t set anything yet when I get this error”? Are you saying that the Diagram that you are setting Overview.observed has not been initialized yet? If so, does everything work OK if you set Overview.observed after initializing the Diagram?

Hi Walter,

Apologies for the lack of clarity. What I mean is that the diagram has not been displayed yet. When I re-read what I posted I realise it is very vague!

The diagram has been setup, and the data has been loaded into the model. Only after that do I setup the overview. The error only occurs when setting Overview.observed to my initialised and loaded diagram.

I can step over the setting of the Overview.observed property, through the debugger in Chrome, and no errors appear in the console. If I continue execution (F8), then errors appear in the console, but not when my code is setting anything, if that makes sense.

I will try re-produce with a smaller sample, however I’m not sure where to start isolating the problem because the error is not triggered from my code anywhere.

Thanks.

Jonathan

Hi Walter,

I can also get the error to occur when I call my zoom to fit function:

myDiagram.model.startTransaction("zoom to fit"); myDiagram.zoomToFit(); myDiagram.model.commitTransaction("zoom to fit");

This is the console trace:

Uncaught Error: Shape.strokeWidth must be a real number and not NaN or Infinity: Infinity go-debug.js:20
u.g go-debug.js:20
u.i go-debug.js:21
u.defineProperty.lz go-debug.js:920
$i go-debug.js:702
Yi.hs go-debug.js:702
li go-debug.js:573
qi go-debug.js:668
$g go-debug.js:586
$g go-debug.js:586
B.pA go-debug.js:540
D.zu go-debug.js:228
Oe.Bd go-debug.js:301
cf go-debug.js:297
Oe.commitTransaction.Oe.Vd go-debug.js:295
D.commitTransaction.D.Vd go-debug.js:233
onZoomToFitClicked desmat-drawingcanvas.js:1286
loadProcessItemsToDrawing desmat-drawingcanvas.js:363
$.ajax.success desmat-drawingcanvas.js:307
p.Callbacks.k jquery-1.8.2.min.js:2
p.Callbacks.l.fireWith jquery-1.8.2.min.js:2
y jquery-1.8.2.min.js:2
p.support.ajax.p.ajaxTransport.send.d jquery-1.8.2.min.js:2

So when getting the error with zoomToFit(), no Overview is involved at all, yes?

Can you get the main Diagram to be displayed at all?

Hi Walter,

I can get the diagram to display properly and work fine with the zoomtoFit(), if I don’t have an Overview diagram.

The moment I add an Overview diagram I run into trouble…

Thanks.

Jonathan

I cannot reproduce the problem using the OrgChartStatic sample. Could you help me figure out how to reproduce the problem?

Hi Walter,

Sure I will try! I’ll download the OrgChartStatic sample, and see if I can reproduce it on that example. I’m sure it is because I am doing something stupid, and not reading the documentation again…


I will have to try tomorrow, and I’ll get back to you as soon as possible.


Thanks again for all the help!

Jonathan

Ok I think I may solved the issue for me. I think the div that holds the overview needs to have a pre-set height when the overview is created. In my case before I initialised the overview, the height of the div was 0. If I preset the height, then it all works fine.

Thanks for help.

Jonathan