Vwa.Page.isShapeInView Method

Last modified: August 06, 2011

Applies to: apps for SharePoint | SharePoint Server 2013

Gets whether the specified shape is visible in the viewport.

var value = Page.isShapeInView(string shapeID)

shapeID A string that specifies the identifier of a shape on the active drawing page.

Boolean   true if the specified shape is visible in the viewport; otherwise, false.

You can use the Vwa.Shape.getId method to determine the identifier of the shape you want to specify.

A shape is visible in the viewport when the shape's bounding box intersects the viewport's rectangle. The method throws an exception if a shape that has the specified identifier does not exist.

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.

The following example creates an HTML text box and button in the Content Editor Web Part. When the button is clicked, the example checks the currently displayed page in the Web Drawing for a shape that matches the string provided in the text box. If a matching shape is found, the shape is highlighted and the Web Part is centered on the shape.

<script type="text/javascript">

// Create the HTML input controls.
document.write("<div> Shape to search for: " +
               "<input type='text' id='shapename' />" + 
               "<input type='button' id='search' value='Search' style='width:100px;height:22px' onclick='searchPage()' />" +
               "&nbsp;<span id='output' style='color:#FF0000'></span></div>");

// Declare global variables.
var vwaControl;
var vwaPage;
var vwaShapes;
var vwaShape;
var shapeBounds;
var searchOutput;

// Hook into the AJAX Sys.Application.load event.

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

// Search the SharePoint page to get the WebPartID# for the Visio Web Access Web Part.
function getVWAWebPartID() {
    // Get a NodesList of all the div tags on the page. 
    var divArray = document.getElementsByTagName("div");
    var webPartElementID;
    // Iterate through the NodesList to get the node with the class attribute "VisioWebAccess."
    for (var i = 0; i < divArray.length; i++) {
        var node = divArray[i];
        // Return the first instance of the Visio Web Access Web Part.
        if (node.className == "VisioWebAccess") {
            webPartElementID = node.parentNode.parentNode.id;
    return webPartElementID;

// Capture references to global variables.
function onDiagramComplete(){
        vwaPage = vwaControl.getActivePage();
        vwaShapes = vwaPage.getShapes();
        searchOutput = document.getElementById('output');

// Search the displayed page for the shape specified by the user.
function searchPage() {
    try {
        // Remove any highlights currently displayed in the drawing.
        if (vwaShape) {vwaShape.removeHighlight()}
        // Get the user's input and get the shape object from the page.
        shapeName = document.getElementById('shapename').value;
        vwaShape = vwaShapes.getItemByName(shapeName);
        // Focus drawing on the shape if it is found.
        if (vwaShape) {
        // Provide feedback to the user if the shape is not found.
        else {
           searchOutput.innerHTML = " Shape not found.";
    catch (err) {

// Focus the displayed Web Drawing page on and highlight the shape sought by the user.
function focusOnShape()
    var isInView;
    var shapeId = vwaShape.getId();
    var shapeX, shapeY;

    // Get the location of the shape on the page.
    shapeBounds = vwaShape.getBounds();
    shapeX = shapeBounds.x;
    shapeY = shapeBounds.y;
    searchOutput.innerHTML = " Shape at: x = " + shapeX + "px, y = " + shapeY + "px";
    // Select the shape the user searched for and highlight it.
    vwaShape.addHighlight(5, "#FF0000");

    // Check whether the shape is currently in view; if not, zoom out of the Web Drawing page.
    isInView = vwaPage.isShapeInView(shapeId);
    if (!isInView){