Hi,

I noticed that all Javascript examples on the main page use the statement diagram = $create(Diagram, null, null, null, $get("diagram")); in order to bound the diagram to the area defined by the canvas "diagram".

At the same time in all the examples the diagrams have a vertical scroll bar, I was wondering how can I get the diagram to occupy only the browser's viewing area and get rid of the scroll bar(s).

I changed the canvas width and height in the main html file yet the diagram's boundary goes beyond the bottom of the screen.

Not sure how to make it fit exactly the canvas's boundaries. Anyone?

Thanks
Florin

Hi Stoyan,
Thanks for your help. Unfortunatelly, I am a beginner Javascript developer, and have a hard time understanding the clientToDoc call.

Essentially I wrote a function that provides me with the screen's width and height in pixels. Then I invoked SetBounds using these dimensions and although the diagram has been readjusted is now  much larger than the width and the height of the screen.

So I just assume that before invoking SetBounds() I need to divide my height and width by the pixel ratio. Yet I don't know how to declare the parameters for the clientToDoc() function, and how to refer to them. I am sure this is very easy for you to explain.

Meanwhile, this is the function that I use to retrieve the browser's size (results are stored in winW, winH)

Thanks
Florin

var winW =0, winH =0;
if (document.body && document.body.offsetWidth) {
winW = document.body.offsetWidth;
winH = document.body.offsetHeight;
}
if (document.compatMode=='CSS1Compat' &&
document.documentElement &&
document.documentElement.offsetWidth ) {
winW = document.documentElement.offsetWidth;
winH = document.documentElement.offsetHeight;
}
if (window.innerWidth && window.innerHeight) {
winW = window.innerWidth;
winH = window.innerHeight;
}

Hi Stoyan,

It works like a charm. Thanks for helping me out.

I was just wondering, is there a place where I can see code examples, the documentation seems to lack examples in that sense..

For example, a statement such as
var nodeBrush = { type: "PathGradientBrush", color1: "Yellow", color2: "Red"};

should work, since it's similar to its equivalent in C#, yet the browser doesn't understand it.

Thanks again,
Florin