Vwa.Page.getZoom Method

Applies to: apps for SharePoint | SharePoint Server 2013

Gets the viewport's zoom level.

var value = Page.getZoom()

Return value

Integer The value can be between 10 and 400 and denotes the percentage of zoom.

Remarks

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 creates five HTML buttons that will display the current zoom level, change the zoom level, get the page’s position in the Visio Web Access Web Part, set the page’s position in the Web Part, and display the page’s size, respectively.

<script type='text/javascript'>

// Create the HTML input controls.
document.write("<div><input type='button' id='getzoom' value='Get Zoom' style='width:120px;height:30px' onclick='Update(this)' />" +
               "&nbsp;Zoom Level:&nbsp;<span id='zoomoutput' style='color:#FF0000'></span></div>");
document.write("<div><input type='button' id='setzoom' value='Set Zoom' style='width:120px;height:30px' onclick='Update(this)' />" + 
               "&nbsp;<input id='zoominput' type='text' /></div>");
document.write("<div><input type='button' id='getpos' value='Get Position' style='width:120px;height:30px' onclick='Update(this)' />" +
               "&nbsp;Page Position:&nbsp;<span id='posoutput' style='color:#FF0000'></span></div>");
document.write("<div><input type='button' id='setpos' value='Set Position' style='width:120px;height:30px' onclick='Update(this)' />" + 
               "&nbsp;<input id='posinput' type='text' /></div>");
document.write("<div><input type='button' id='getsize' value='Get Page Size' style='width:120px;height:30px' onclick='Update(this)' />" +
               "&nbsp;Page Size:&nbsp;<span id='sizeoutput' style='color:#FF0000'></span></div>");

// Declare global variables.
var vwaControl;
var vwaPage;

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

// 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() {
    
    // 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;
            break;
        }
    }
    return webPartElementID;
}

// Capture a reference to the vwaPage object in the global variable.
function onDiagramComplete(){
    try{
        vwaPage = vwaControl.getActivePage();
    }
    catch(err){
        alert(err);
    }
}

// Get or set the position of the page displayed in the Visio Web Access Web Part from user input.
function Update(callingNode){
    try{
        // Determine which input control called the function.
        var callingNodeId = callingNode.id;
        switch(callingNodeId)
        {
            // Get the current zoom level of the page and display it to the user.
            case "getzoom":
                var zoomLevel = vwaPage.getZoom();
                document.getElementById("zoomoutput").innerHTML = "";
                document.getElementById("zoomoutput").innerHTML = zoomLevel;
                break;
            
            // Set the zoom level of the page from user input.
            case "setzoom":
                var zoomLevel = document.getElementById("zoominput").value;
                document.getElementById("zoominput").value = "";
                vwaPage.setZoom(Number(zoomLevel));
                document.getElementById("zoomoutput").innerHTML = zoomLevel;
                break;
            
            // Get the position of the page within the Web Part and display it to the user.
            case "getpos":
                var pagePos = vwaPage.getPosition();
                var pageX = pagePos.x;
                var pageY = pagePos.y;
                document.getElementById("posoutput").innerHTML = "";
                document.getElementById("posoutput").innerHTML = pageX + ", " + pageY;
                break;

            // Set the position of the page from user input.
            case "setpos":
                var pagePos = document.getElementById("posinput").value;
                
                // Change user input from 'x, y' format to individual values.
                var pagePosArray = pagePos.split(",");
                var pageX = Number(pagePosArray[0]);
                var pageY = Number(pagePosArray[1]);
                vwaPage.setPosition(pageX, pageY);
                document.getElementById("posinput").value = "";
                document.getElementById("posoutput").innerHTML = pageX + ", " + pageY;
                break;

            // Get the size of the page displayed in the Web Part.
            case "getsize":
                var pageSize = vwaPage.getSize();
                var pageWidth = pageSize.width;
                var pageHeight = pageSize.height;
                document.getElementById("sizeoutput").innerHTML = pageWidth + "px wide by " + pageHeight + "px high";
                break;
        }
    }
    catch(err)
    {
        alert(err);
    }
}
</script>

See also

Reference

Vwa.Page Class

Vwa.Page Class Methods