Visio document imported into a SharePoint VisioWebAccess webpart : open links in new tab or window

Question

Hello.
I'm using a SharePoint Server 2010, with a Visio Web Access WebPart.
With Visio 2010, I created a vdw document which I put in this webpart.
This works very well, but i have some hyperlinks which I want to be opened in a new tab (or a new window), so that he SharePoint page won't be replaced by the target page.
So, in Visio, I tried to modify the ShapeSheet of each hyperlink, by setting the "NewWindow" to true. Unfortunately, it does not work : links are replacing the current page.
I found nothing on the web that could give me a trick to do this.
Has anyone an idea ?
Thanks a lot
_David

Answer 1

Hello _David C,
You can create some JavaScript code that will open the hyperlink in a new window. Here is a JavaScript sample that will open the first hyperlink applied to a shape in a new browser window. I have tested it in both IE and FireFox.
<script type="text/javascript">
// Declare the global variables for the script, for the Visio Web Access Web Part, the active page in the Web Part,
// the shapes on the active page, and the shape on the page without hyperlinks.
var vwaControl;
var vwaPage;
var vwaShapes;
var coldShape;
// Add a handler to the AJAX Sys.Application.load event.
Sys.Application.add_load(onApplicationLoad)
function onApplicationLoad()
try{
// Capture a reference to the current instance of the Visio Web Access Web Part.
// Add a handler to the 'diagramcomplete' event.
vwaControl= new Vwa.VwaControl(getVWAWebPartID());
vwaControl.addHandler("diagramcomplete", onDiagramComplete);
catch(err){
alert(err);
function getVWAWebPartID()
// Search all of the <div> tags on the page to find the div tag with the ID of the VWA Web Part.
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;
function onDiagramComplete()
try{
// Set the vwaPage and vwaShapes variables to the active page and the shapes collection on that page, respectively.
vwaPage = vwaControl.getActivePage();
vwaShapes = vwaPage.getShapes();
// Set the 'cold shape' for the current active page in the drawing.
selectColdShape();
// Remove the handler from the shape selection changed event and then add it back to the event.
vwaControl.removeHandler("shapeselectionchanged", onShapeSelectionChanged);
vwaControl.addHandler("shapeselectionchanged", onShapeSelectionChanged);
catch(err)
alert(err);
onShapeSelectionChanged = function (source, args)
try{
// Get the array of hyperlinks from the selected shape.
var vwaShape = vwaShapes.getItemById(args);
var newURLArray = vwaShape.getHyperlinks();
var newURL;
// Check to see whether the shape has any hyperlinks.
if (newURLArray.length > 0)
newURL = newURLArray[0].value;
// Check to see if the hyperlink goes to another page in the drawing.
if (newURL.indexOf('vdw') < 0)
// Open the hyperlink in a new window.
var newWindow = window.open(newURL);
else
// Set the active page to the new page.
setNewPage(newURL);
catch(err)
alert(err);
function selectColdShape() {
try {
// Set variables with the names of shapes on the pages that do not contain hyperlinks.
// Customize the values for these variables to fit your web drawing.
var coldShapePg1 = "Sheet.6";
var coldShapePg2 = "Sheet.10";
// Check to see if the coldShape exists on this page.
if (vwaShapes.getItemByName(coldShapePg1)) {
// Set the active shape to the shape without hyperlinks on page 1.
coldShape = vwaShapes.getItemByName(coldShapePg1);
vwaPage.setSelectedShape(coldShape.getId());
else if (vwaShapes.getItemByName(coldShapePg2)) {
// Set the active shape to the shape without hyperlinks on page 2.
coldShape = vwaShapes.getItemByName(coldShapePg2);
vwaPage.setSelectedShape(coldShape.getId());
catch (err) {
alert(err);
function setNewPage(pageId) {
// Set the active page in the drawing to the page ID passed in as argument.
var indexOfAmp = pageId.indexOf("&");
var page = pageId.slice(6, indexOfAmp);
vwaControl.setActivePage(page);
</script>
Note that this code requires that each page have a "cold shape" that does not have any hyperlinks applied to it. In my test drawing, I added a hidden shape (in ShapeSheet, Width = 0, Height = 0) that did not have any hyperlinks. This is because the Vwa.shapeselectionchanged
event fires when you switch pages, which creates the possibility that the JavaScript code will open a new window when you change pages in the viewer.
If you are not familiar with the Visio Services JavaScript Object Model, I suggest that you check out the following resources:
http://blogs.msdn.com/b/visio/archive/2010/02/21/the-visio-services-javascript-mashup-api.aspx
http://msdn.microsoft.com/en-us/library/ff394649.aspx
http://msdn.microsoft.com/en-us/library/ff394600.aspx
I hope that this helps,
E. Schmidt, Technical Writer
Microsoft Corporation