Vwa.Shape.getBounds Method

Applies to: apps for SharePoint | SharePoint Server 2013

Returns an anonymous object that specifies the bounding box of the shape.

var value = Shape.getBounds()

Return value

Object An anonymous object that specifies the bounding box of the shape.

The anonymous object returned has the following properties:

  • x An integer that specifies the x-coordinate of the bounding box.

  • y An integer that specifies the y-coordinate of the bounding box.

  • width The distance in pixels between the left and right edges of the bounding box of the shape, excluding any data graphics associated with the shape.

  • height The distance in pixels between the top and bottom edges of the bounding box of the shape, excluding any data graphics associated with the shape.

Remarks

The origin of the Cartesian coordinate system for x and y is the top left corner of the drawing page; x increases in value from left to right, and y increases in value from top to bottom. All values are expressed in pixels.

For more information about how to add a Visio Web Access Web Part to a SharePoint Web Parts page, see Customizing Visio Web Drawings in the Visio Web Access Web Part.

Example

The following example adds a handler to the Vwa.shapeselectionchanged event that creates either an HTML or a XAML transparent overlay on the selected shape, depending on the display mode.

<script type="text/javascript">

// Hook into the AJAX Sys.Application.load event.
Sys.Application.add_load(onApplicationLoad)

// Define global variables.
var vwaControl;
var vwaPage;
var vwaShapes;
var currentlyAnnotatedShape;  

// Capture a reference to the current session of the Visio Web Access Web Part.
function onApplicationLoad() {
    try{
        vwaControl= new Vwa.VwaControl(getVWAWebPartID());
        vwaControl.addHandler("diagramcomplete", onDiagramComplete);
    }
    catch(err){
        alert(err);
    }
}

// Search the SharePoint page to get the WebPartID# for the Visio Web Access Web Part.
function getVWAWebPartID() {
    var divArray = document.getElementsByTagName("div");
    var webPartElementID;
    for (var i = 0; i < divArray.length; i++) {
        var node = divArray[i];
        if (node.className == "VisioWebAccess") {
            webPartElementID = node.parentNode.parentNode.id;
            break;
        }
    }
    return webPartElementID;
}

// Capture references to the global variables and register a handler for shapeselectionchanged event.
function onDiagramComplete() {
    try{
        vwaPage = vwaControl.getActivePage();
        vwaShapes = vwaPage.getShapes(); 
        vwaControl.addHandler("shapeselectionchanged", onShapeSelectionChanged);
    }
    catch(err){
        alert(err);
    }
}

function onShapeSelectionChanged(source, args){
    try{
        // Ignore the shapeselectionchanged event raised when the selection is cleared.
        if (args != null && args != Sys.EventArgs.Empty){

            // Get the value of the display mode for the Visio Web Access Web Part.
            var displayMode = vwaControl.getDisplayMode();

            // Remove any existing overlay from the diagram.
            removeAnnotation();
            currentlyAnnotatedShape = vwaShapes.getItemById(args);

            // Test to see what the current display mode is.
            if (displayMode == 1) {
                
                // The display mode is Silverlight; add a XAML overlay.
                currentlyAnnotatedShape.addOverlay(
                    "Overlay", 
                    "<Rectangle Height=\"" + currentlyAnnotatedShape.getBounds().height + "\"" + 
                    " Width=\"" + currentlyAnnotatedShape.getBounds().width + "\"" + 
                    " Stroke=\"Black\" StrokeThickness=\"1\" Fill=\"#88FF0000\"" + 
                    " RadiusX=\"0.0\" RadiusY=\"0.0\"\/>",
                    1, 
                    1,
                    currentlyAnnotatedShape.getBounds().width,
                    currentlyAnnotatedShape.getBounds().height);
            }
            else {
                
                // The display mode is raster format; add an HTML overlay.
                currentlyAnnotatedShape.addOverlay(
                    "Overlay", 
                    "<div id=\"HTMLDiv\" style=\"width: 100%; height:" + 
                    "100%;background-color:#FF0000;z-order:32;" + 
                    "filter:alpha(opacity=30);\"><\/div>", 
                    1, 
                    1,
                    currentlyAnnotatedShape.getBounds().width,
                    currentlyAnnotatedShape.getBounds().height);
            }
            
            // Re-center the drawing on the selected shape.
            vwaPage.centerViewOnShape(currentlyAnnotatedShape.getId());
        }
    }
    catch(err){
        alert(err);
    }
}

// Remove any existing overlay.
function removeAnnotation() {
    if (typeof(currentlyAnnotatedShape)!="undefined") {
            currentlyAnnotatedShape.removeOverlay("Overlay");
    } 
}
</script>

See also

Reference

Vwa.Shape Class

Vwa.Shape Class Methods