Visio Services Technical OverviewChris HopkinsApplication Development Consultant | US ServicesMicrosoft Corporation

AgendaIntroduction to Visio ServicesWeb Part ConnectionsMash-up APIQ&A

Visio 2010 Messaging Pillars

Publish and Share

Share interactive, refreshable, data-linked diagrams with others via their browser, with just a few clicks.

Refreshable, data-linked diagrams on the web! • Publish a data-linked diagram to SharePoint using Visio Services!• Anyone with SharePoint E-CAL can view the diagram, delve into data

details even those who don’t have Visio installed. • Automatic data refresh (real-time dashboard)!• Interactive: Zoom & Pan around the diagram and follow hyperlinks in

shapes, navigate through pages, delve into the data related to each shape

• Diagram Viewable in Silverlight or PNG

Visual Mash-ups in SharePoint!• Using Composite App capability in SharePoint and New Visio Services

API.• Basic mash-ups for end-users with no code• Advanced mash-ups with Code

SharePoint Process Repository• Publish and share your process diagrams and subprocesses with one

click for re-use and collaboration in SharePoint Process Repository.

Microsoft Platform Value• Visio® 2010 makes your diagram the graphical front-end of a LOB

application• Leverage and maximize your existing investment on Microsoft

technology for low-cost IT Management, Business Intelligence, and Process Management

Value Stream Map Supply Chain Diagram Network Diagram

LOB System A

LOB System B

LOB System C

Visio ServicesDynamic data-linked diagram in web browser

Content CreatorCreate Data-linked Diagram just as in Visio 2007

Data Source• Excel Services• SharePoint Service List• SQL Server• OLEDB / ODBC

Data Consumer• Updates Data Graphics by

clicking refresh button• Data refresh can be

automated by setting interval time

Publish “VDW” file to SharePoint Server 2010

Data Consumer • Views data-linked diagram in web

browser• Can open the diagram in Visio

Import latest data to update Data Graphics

Publishing to Visio ServicesChris HopkinsConsultantMicrosoft Corporation

DEMO

Server Features - RenderingNew File Format

.VDW – Visio Drawing WebContains XAML needed for renderingVisio 14 client can Edit and Save / full fidelity

SupportsShape DataData GraphicsHyperlinks

Read-only on the server – cached updates

VSD

Server Features - Data RefreshRefreshable DataRecordSets

SQL (7.0 – 2008)SharePoint ListsExcel ServicesOLE DB / ODBC* Custom Data Adapters

Does not supportAccess / Excel (JET & ACE)SQL Analysis Services or Reporting Services

Visio Services Publishing and Viewing RequirementsTo Publish To View

Client AppsVisio Professional 2010Visio Premium 2010

Support Level Operating System Browser

Level 1Full fidelity on all web pages

Windows XP, Vista, Win7Windows 2003, 2008, 2008 R2

IE7, IE8(32bit)(No IE6)

Windows XP, Vista, Win7Windows 2003, 2008, 2008 R2

Firefox 3.x

Level 2 Almost full fidelity on all pages

Windows XP, Vista, Win7 IE7, IE8 (64bit)

Mac OS-X LeopardSafari 4.xFirefox 3.x

Unix / Linux Firefox 3.x

Level 3No fidelity support

Everything else

Server Apps SharePoint Server 2010 (Not MOSS 2007 or SharePoint Foundation)

SharePoint CAL SharePoint Enterprise CAL

Data SourceExcel Services (No Excel & Access), SQL Server (No AS/RS), SharePoint Service List, ODBC/OLEDB

*Custom Data Adapters

Visio Services in the Microsoft technology stack

15

Windows Server (x64)

SharePoint Server 2010Foundation / Standard / Enterprise

SharePoint ServicesEnterprise Site Collection Feature

Windows Identity FoundationActive Directory Federation Services 2.0

Windows CardSpace 2.0IIS SQL DB

Visio ServicesIncluded as part of SharePoint Server 2010 Enterprise

Available in hosted & non-hosted SharePoint

Performance OptionsCentral Administration

Manage Service Applications

Maximum Diagram SizeMinimum Cache Age (refresh)Maximum Cache Age (render)Maximum Recalc Duration

Security OptionsSQL

Broswer Secure Store Service

redmond\tomredmond\tom

redmond\tomredmond\tom

Target Application mapsredmond\domain users

to redmond\vsuser

Target Application mapsredmond\domain users

to redmond\vsuser

redmond\vsuserredmond\vsuser

External Data

Unattended Service Account referenceConfigured via Secure Store Service (SSS)

Visio Web Access Web Part (VWA)Included in SharePoint 2010

Only supports VDW format

Configuration optionsDiagram URLAuto Refresh IntervalShape Data items to make availableto Web Part connections

Web Part ConnectionsEnable part to part communication

Enable common scenarios for advanced users

Web Part ConnectionsJavaScript basedBrowser or SharePoint Designer

Additional options available in SharePoint Designer

Provider supplies document URLConsumer loads the diagram for view

Page Name can only be configured using SharePoint Designer

Get Drawing URL and Page Name From

Provider supplies list of Shape NamesConsumer highlights specified shapes

Highlight Color can only be configured using SharePoint Designer

Get Shapes to Highlight From

Get Filter Results FromProvider supplies Shape Data valuesConsumer highlights shapes matching values

Get Shape to View FromProvider supplies Shape NameConsumer centers view on specified shape

Zoom Level can only be configured using SharePoint Designer

Provider in this case is VWAChoose which data to send to consumer

Consumer processes sent arguments

SharePoint Designer is required to define multiple arguments

Send Shape Data To

Web Part Connection LimitationsWeb part page can support many connections

Only one connection per connection definitionSend Shape Data to InfoPath web partSend Shape Data to Excel web part

Build advanced scenarios using the Mash-up API

Web Part Connection SummaryVisio Web Access Web Part supports

Get Drawing URL and Page Name fromGet Shapes to Highlight fromGet Filter Results fromGet Shape to View fromSend Shape Data to

Web Part ConnectionsChris HopkinsConsultantMicrosoft Corporation

DEMO

Visio Services Mashup API - JavaScriptProgrammatic access to a shape’s

Shape Data fieldsHyperlinksBounding Box Coordinates

Perform actionsHighlight shapesPlace overlays on the diagramChange the viewport’s Pan and Zoom properties

Events in the diagram trigger changes on page. Typical API scenarios

OnClick() { for (var j = 0; j < data.length; j++) { if (data[j].label == "Step") { document.getElementById('StepData').src= "http://localhost:8080/details.aspx?ID=" + "'" + data[j].value + "'"; return; }}} // NOTE: this is pseudo code.

Typical API scenariosOnClick() { shapes = activePage.getShapes();

foreach shape in shapes { if (shape.data[0].value = selOption.value) { shape.addHighlight(); } }} // NOTE: this is pseudo code.

Events on the page trigger changes in the diagram.

Visio Services JavaScript APIgetActivePage()

setActivePage()

getShapes()

getItemById() getItemAtIndex()

diagramComplete

shapeMouseEnter

shapeMouseLeave

selectionChanged

diagramError

getSelectedShape()setSelectedShape()

VWA Control

Page

Shapes

Shape

getShapeData()getHyperlinks()

Shape

Visio Services Mashup APIChris HopkinsConsultantMicrosoft Corporation

DEMO

SummaryVisio Services

Rending diagrams in the browserRefreshing data-connected diagrams without having to republish

Visio Web Access Web PartAllow the creation of simple dashboards with automatic refresh capabilities

Web Part ConnectionsAllow advanced users to create mash-ups without developing in JavaScript

JavaScript APIAllow developers to build rich dashboard applications using JavaScript, html, asp, etc.

Check out the appendix for a complete API listing as well as the JavaScript code used in the API demonstration

Track ResourcesResource 1

Resource 2

Resource 3

Resource 4

Resources

www.microsoft.com/teched

Sessions On-Demand & Community Microsoft Certification & Training Resources

Resources for IT Professionals Resources for Developers

www.microsoft.com/learning

http://microsoft.com/technet http://microsoft.com/msdn

Learning

Related ContentBIE03-INTVisio Services Add-in for Microsoft System Center Operations Manager 2007 R2

Visit the Visio 2010 kiosk at the TechEd pavilion

Complete an evaluation on CommNet and enter to win!

Visio Services and the Mashup APIChris HopkinsConsultantMicrosoft Corporation

QUESTIONS?

© 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a

commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.