Vwa.ShapeCollection.getItemById Method

SharePoint 2013

Last modified: August 06, 2011

Applies to: apps for SharePoint | SharePoint Server 2013

Returns the shape that has the specified identifier (ID).

JScript
Copy 
var value = ShapeCollection.getItemByID(string shapeID)

shapeID A string that specifies the ID of the shape to return.

Vwa.Shape The shape that has the specified ID.

You can get the ID of a shape by using the Vwa.Shape.getId method.

If shapeID does not refer to a shape that is on the active Web Drawing page, this method returns null.

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 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.

JavaScript
Copy 
<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>
Show: