To draw shape with in working area based on screen resolution size and height and width

I should create shapes with in diagram working area based on system screen resolution size.

The diagram should not expand over screen height and width. I should avoid scroll bar both side.

I have draw border inside the diagram working area based on the screen resolution size height and width.

Currently, I am using GoJS v1.6.23

Please provide your suggestion .

GoJS never modifies the size of the HTML DIV element holding the Diagram. If you programmatically modify the DIV size, call Diagram.requestUpdate: Resizing Diagrams -- Northwoods Software

What happens when the user zooms in or out? What do you want to do then? Or do you want to set Diagram.allowZoom to false?

You can make sure there are no scrollbars by setting Diagram.hasHorizontalScrollbar and Diagram.hasVerticalScrollbar to false. However, users can still scroll or pan. Do you want to allow that? If not, you can set Diagram.allowHorizontalScroll and Diagram.allowVerticalScroll to false.

Did you want to disallow users from dragging nodes outside of a particular area? There are several ways to accomplish that.

Perhaps you are interested in the Absolute sample, which demonstrates these concepts: Absolute positioning within the viewport

Thanks for your response. As provided the informations and links are partially resolved my problem.

I have used on below code as you given above links
fixedBounds: new go.Rect(0, 0, window width, window height),
{ dragComputation: stayInFixedArea }, The top & left side shapes are displaying with in diagram area. right & bottom side shapes crossed diagram working area(border). I have faced another issue after implementing code.

after that I could not able to drag shaped normally. Normal dragging function is not working properly.

please provide your suggestion.

You’ll need to adapt the stayInFixedArea function to work with the kinds of nodes that you have, especially if the Node.location is different from the Node.position.

Thanks for your response.

Thanks for your response. currently i am using Go JS 1.7 version and implementing diagram ruler code. Ruler is displaying in diagram area with indicator. My requirement is place indicator based on system resolution height and width .

“1024×576”, “1152×648”, “1280×720”, “1366×768”, “1600×900”, “1920×1080”, “2560×1440”

I could not able to set the indicator based system height and width area. default it is displaying mouse over area.
I should placed based system resolution height . please advise how to set indicator based on the resolution height and width

i have used below code. how to set region dynamically system height & width and placed indicator.
$$(go.Shape, { geometryString: “M0 0 V400” }),
$$(go.Shape, { geometryString: “M0 0 V3”, interval: 1, alignmentFocus: go.Spot.Bottom }),
$$(go.Shape, { geometryString: “M0 0 V15”, interval: 5, alignmentFocus: go.Spot.Bottom }),

please advise me on this.

I don’t understand what the screen resolution and size have to do with GoJS. The only things that matter are the width and height of the DIV that is hosting the Diagram.

Thanks for your response. ruler diagram Graduated Panels geometryString string starts with - value 0 to values. 2000

i m using indicator in my diagram area. it is displaying red color line indicator on top of graduated panel line. The want place
indicator line system monitor height & width in graduated panel. For Example. my system height 1080px and width is 1920 px means . The red color indicator will be point out or placed vertically in 1080 line in graduated panel. Horizontal indicator will be point out in 1920 value in graduated panel line when loading the page. currently red line indicator is pointing value where the mouse is located in diagram area.

please advise me on this

I’m having difficulty understanding what you want to do.

Presumably you have seen the updateIndicators function in the Rulered Diagram sample, Diagram with Rulers.

If you have read GoJS Graduated Panels -- Northwoods Software, you will know that to find the point for a particular value of a Graduated Panel, you can call Panel | GoJS API. That’s in the panel’s coordinates, so you’ll want to call GraphObject | GoJS API to convert the point’s coordinate system from the panel’s to the document coordinate system, so that you can set the location of the indicator Part.

Thanks for your response.