Visio Insights
The official blog of the Microsoft Visio product team

  • Visio Insights

    Visual Updates to Shapes in Visio 2010


    One of the goals of the Visio 2010 release is to make it easier to create attractive, presentation-quality diagrams. Previously on this blog, we have discussed our improvements to backgrounds, layout, routing, and themes. Visio 2010 also features improvements to the default look of many templates, as well as over 500 newly designed shapes. Below are a few highlights of these changes.

    New default theme

    Many Visio 2010 templates feature a new, consistent set of default line, font, and shadow properties that help make diagrams look more modern. Here is an example comparing part of a Visio 2007 flowchart with a Visio 2010 flowchart:

    V12 flowchart

    In addition to these general enhancements, below are some specific templates we made significant changes to.

    Directional Map

    The Landmark Shapes stencil in the Directional Map template has around 30 newly designed shapes. Here are a few:

    Directional Map Shapes


    The Workflow Shapes template also has around 30 newly designed shapes. Here are a few:

    Workflow Shapes 


    Here is a calendar created in Visio 2010, with our newly designed calendar and icon shapes:



    Visio 2010’s timeline shapes have a sleek new look. Here is an example:


    The above are just a few examples. Here is a more comprehensive list of stencils and templates with new or updated shapes:

    • Six Sigma
    • Data Graphics Legend
    • Containers
    • Callouts
    • Business Process Modeling Notation (BPMN)
    • BPMN Pools & Lanes
    • Basic Flowchart
    • Compliance
    • Cross-functional
    • SharePoint Workflow
    • Wireframe
    • Backgrounds
    • Borders
    • Timeline
    • Web site map
    • Calendar
    • Workflow
    • Landmarks

    We are interested in your feedback on these visual updates. You can use the Send a Smile feedback tool or comment on the blog to let us know what you think.

  • Visio Insights

    Video: Process Diagrams in Visio 2010


    Recently Mark Nelson from the Visio team sat down with Harry Miller (off-screen) to discuss some of the improvements in Visio 2010 related to process diagrams.  The video includes explanations of our Process Management investments as well as demos for Cross-functional Flowchart, BPMN diagram and Validation features.


    Get Microsoft Silverlight


    The conversation is the latest in a video series titled “Visio: Drawing on Experience” posted on Microsoft TechNet.  Other videos featuring some of our Visio MVPs can be found here:

  • Visio Insights

    Improved Flowchart Routing in Visio 2010


    When creating and maintaining flowcharts, a pain point users suffer from is ensuring that the connectors between shapes look good. Visio introduced the dynamic connector many releases ago to help simplify diagram maintenance. Dynamic connectors in combination with dynamic glue allow Visio to choose the sides of shapes to glue your connectors for the best looking results.

    In Visio 2010 we made improvements to Visio's routing engine to address some common flowcharting pain points. (For more on the dynamic connector and why you should use dynamic glue, see this previous post titled "Gluing It All Together". )

    Improving Flowchart Readability

    Clarity is important in flowcharts. Overlapping connectors flowing in opposite directions can create ambiguity about the meaning of the diagram. It is easy to get into a situation where two connectors appear visually to be connected, but were not explicitly connected by the diagram author. Visio 2010's routing engine detects such ambiguous situations and relocates connectors to actively avoid them.

    Consider the example below where I draw two dynamic connectors: one from shape A to B and the other from B to C. In Visio 2007, this leads to an ambiguous drawing, where it appears as if shape A is connected to shape C. Visio 2010 moves the connector between A and B to an alternate side of shape B to resolve the ambiguity.

    incoming conflict

    We made this design change based on user feedback. It scales to handle more than just a few connectors, and allows connectors to overlap when they are flowing in the same direction.

    A consequence of this change is that if you open a diagram that was created in older versions of Visio in Visio 2010, as you edit your diagram, you may see connectors relocate to different sides of shapes. Note that Visio doesn't move glue points of connectors that are statically glued.

    Relaxing Constraints on Flowchart Direction

    Visio flowcharts that use the "Flowchart" routing style have a routing direction, like "Top to Bottom" or "Left to Right". In flowchart routing, this controls what sides of shapes dynamic connectors (mostly) connect to. Strict adherence to this direction can easily lead to situations where a dynamic connector takes a path around a shape with 5 segments.

    Using "Top to Bottom" as my routing direction, routes generally exit from the bottom of a shape and connect to the top of the shape, except in cases where shapes line up exactly.

    In Visio 2010, we enable dynamic connectors to connect to alternate sides of shapes when the shapes are close to each other.

    virtual overlap

    To strike a balance between having simple looking connectors and still adhering to the flowchart direction, Visio connects to non-standard sides of shapes when two shapes are close to each other in the axis of the routing direction.

    As always, we're interested in your feedback on routing, so use the Send a Smile feedback tool or comment on this post to let us know what you think.

  • Visio Insights

    Shape Conversion in Process Engineering


      A recent newsgroup post asks for an explanation of the cells that get added to a shape when it is converted using the Process Engineering add-on. 


      The Shape Conversion command in Process Engineering allows you to make any shape work like the built-in Process Engineering shapes.  We recognized that customers who made Piping & Instrumentation diagrams often had custom equipment or valves or instruments that they needed to include in the diagram.  Shape Conversion modifies a custom shape to make it recognizable by the Process Engineering add-on and match the behaviors of built-in shapes.


      You can try this by drawing a rectangle and choosing Shape Conversion from the Process Engineering menu.  In the dialog, note that the shape Source is already set to Selected Shapes.  Process Engineering can also bring in shapes from other documents or CAD symbols.  Then comes the challenging part: you can optionally give the shape a Category and Tag Format.  Categories are used to organize the shape in the Component Explorer window.  You can choose an existing category or type in a new string.  Tag formats are used for automatically labeling and numbering shapes.  You must choose from an existing tag format.  Visio only offers you choices for Categories and Tag Formats that already exist in the drawing, so if you want your shape to be a piece of Equipment you should drop a built-in Equipment shape on the drawing before converting your custom shape.



      After clicking OK, you can open the Shapesheet window to see what changes were made to your shape.  The primary change is the set of User-defined cells added to the shape.  These cells identify the shape and control its behavior in the diagram.



      Here is a brief explanation of each cell:


      A GUID (unique identifier) that tells Visio what add-on is managing the shape.  All shapes that are used with Process Engineering, need the GUID matching the Process Engineering add-on.


      The Category that the shape is assigned to.  The shape appears under this name in the Component Explorer.


      The current tag name (label & number) for the shape.


      The Tag Format name and expression for the shape.  Unless the Component Tag has been overwritten, this is the automatically generated label displayed on the shape.


      The sequence number for the shape.  Visio updates this value when components are renumbered.  This value then feeds into the Component Tag.


      A Boolean value that determines whether the Component Tag is displayed on the shape.  This is manipulated by an Action in the Actions section.


      A value that references the global page setting for hiding tags.  If tags are hidden at the page level, then the local setting is ignored.


      This is a bit flag that controls the layout behavior of the components in the diagram.  Mostly these settings determine how the split and heal features in Process Engineering work.  Here are the bits:


      CAUSES SPLIT = 1 (Splits connector when dropped on connector)

      CAUSES HEAL = 2 (Heals connector when deleted)

      ALLOWS SPLIT = 4 (Connector splits when shape dropped)

      ALLOWS HEAL = 8 (Connector heals when shape deleted)

      ALLOWS JUNCTION = 16  (Connector to connector connection)

      JUNCTION IN USE = 32  (Temporary state)


      The default setting here is 31, which enables all the split and heal and junction behaviors.


      There are a few other changes to connection points, action cells and text to complete the conversion.  These are straightforward changes, and you can inspect the Shapesheet to see the details.


  • Visio Insights

    Visio "vNext"


    Tuesday more than 300 customers, partners and Visio community members gathered for Day 1 of Visio Conference 2008.   Attendees were treated to an impressive array of partner solutions, product demonstrations and information-filled sessions.  To top it all off, attendees got the first sneak peak at the next version of Microsoft Office Visio. 




    At this point Visio "vNext" is still in an early stage (pre-Alpha), but we wanted to give everyone a glimpse of the fantastic capabilities of the next version and outline our high-level investments.  Keep in mind that plans can and do change as we respond to feedback and continue working toward completion.  We are publicly showing just a few of the features planned.  Here are the three areas where we are concentrating most of our efforts:




    Process Management

    Visio "vNext" reinvents the core flowcharting experience in Visio.  Flowchart creation is faster and easier than ever.  Cross-functional flowcharts in particular are improved.  Going beyond a simple drawing canvas, Visio understands the logical structure of the diagram far better.  This leads to more advanced process diagramming capabilities that put the user firmly in control over the graphical representation of their processes.


    Ease of Use

    Visio "vNext" adopts the Office Fluent user interface that you see today in Office 2007 core applications.  The Ribbon and Live Preview components in particular take the guesswork out of finding Visio commands and choosing between settings.  At the same time Visio improves a wide range of existing features, bringing the results-oriented concepts behind the Fluent UI onto the diagramming surface itself.  The Shapes window, layout and AutoConnect are significantly enhanced.  Visio is even easier to use and significantly reduces the time needed to create and modify diagrams.


    Visio Services

    Visio "vNext" introduces server-rendered, data-refreshable diagrams for the first time.  Visio Services allows data connected diagrams to be published from Visio to a server and viewed by users directly in their web browser.  There are no client bits to install.  An API is also provided for creating mashups of diagrams and additional data.



    There is far more to talk about with Visio "vNext".  In future posts we will begin to provide more details and present screen shots.  However, there are also plenty of things to discuss about the current Visio 2007 product.  We'll cover both in the coming months.  Please stay tuned and be sure to give us your feedback.


  • Visio Insights

    Visio as a Business Process Analysis Tool


    Visio had the opportunity to present at Microsoft's SOA & BP conference last November on using Visio as a Business Process Analysis Tool.  A video of that presentation is now available for viewing.  Mark Nelson from the Visio team describes how Visio 2007 helps bring BPA to the masses through its in-box feature set and robust solutions platform.  Also Keith Sharp from partner Ascentn demonstrates their AgilePoint BPM product, which is built on the Visio platform.


  • Visio Insights

    Service Pack 2 available for Visio 2007


    Yesterday, we released Service Pack 2 (SP2) for Visio 2007. You can download and install it from:

    Among the issues we've addressed in SP2 are these:

    • A crash caused by early versions of the Broadcom “Send To Bluetooth” add-in occurs every time Visio is shut down. The first crash on exit will still occur, but subsequent crashes will not. The add-in will be disabled until it is updated to a newer version from Broadcom. More information on this and similar add-in issues is available here:
    • When the Reports feature is used to export a report to Microsoft Office Excel, Excel opens without any user interface except the worksheet window. The ribbon does not appear.
    • Script errors occur when Internet Explorer 8 is used to browse Web pages that are saved from Visio.
    • When a Visio drawing is inserted as a linked object in PowerPoint, Word, or Excel, and the link is updated, the quality of the image degrades.
    • If a Visio file name contains the -r- or -s- characters (for example, “filename -r-”), it triggers a repair of the application when the file is opened in Visio.
    • When a shape is dragged between two instances of Visio, the open regions of the shape are opaque, and this makes it difficult to position the shape on the new page.
    • Appointments in a Microsoft Office Outlook calendar do not import into Visio when the language version of Visio and the Windows locale setting are different.
    • Visio crashes when the 117th layer is added to the page.
    • In a UML Model Diagram, changing the Flow Kind of a Message Object does not correctly reset the Operation field in the UML Message Properties dialog box.

    In addition, SP2 provides these new capabilities:

    • The ability to programmatically export an XML file compliant with the XMI standard from a UML diagram. This functionality was formerly available only as a separate download for Visio 2003.
    • The ability to disable access to CAD (*.dwg) files in Visio 2007. More information is available in this article:
  • Visio Insights

    Visio 2007 Service Pack 1


    It's been about a year since the release of Visio 2007 and Office 2007, and Microsoft has now published Service Pack 1.  Here is the download link for English.  You can choose another language from this link as well.

    The goals of this service pack are to provide compatibility for upcoming releases such as Windows 2008 Server, improve security and address key performance and reliability issues.

    A specific fix to note for Visio:

    • Microsoft Office Visio 2007 now properly redraws shapes when users apply a dynamic connector that is part of a group of shapes in Office Visio 2007.

    The KB article with all the details is here:


  • Visio Insights

    The Point Along Path ShapeSheet Functions in Visio 2010


    In a previous blog post about new ShapeSheet functions, we introduced a set of new functions called the Point Along Path functions. These functions allow interactions with geometry paths of shapes. This post provides more detail about these new functions.

    The following functions open up a broad set of shape interactions for shape and solution developers:



    ANGLEALONGPATH(section,travel [,segment]) Returns the angle of the tangent to the path at a given point.
    DISTTOPATH(section,x,y) Returns the shortest distance from the point represented by the specified coordinates to a point on the path.
    NEARESTPOINTONPATH(section,x,y) Returns the percentage of the distance along the path of the point that is nearest to the specified coordinates, as a value between 0 and 1.
    PATHLENGTH(section[,segment]) Returns the length of the path that is defined in the specified Geometry section.
    PATHSEGMENT(section,travel) Returns the 1-based segment number at the specified percentage mark along the specified path.
    POINTALONGPATH(section,travel[,offset][,segment]) Returns the coordinates of a point on, or offset from, the path.
    SEGMENTCOUNT(pathRef) Returns the number of line segments that make up the path.

    In the above functions:

    • Arguments in brackets [ ] are optional
    • Section always refers to a Geometry path. The correct way to reference a geometry path section is to enter the section reference followed by “.Path” (for example, Sheet.1!Geometry2.Path)
    • Travel is a measure of the position along the path between the beginning and the end points, defined as a percentage. It is always represented by a number between 0 and 1, where 0 represents the beginning point, and 1 represents the end point
    • Segment is a 1-based index of a line segment in the path that corresponds to a row in the geometry section.

    To give you an idea of what you can do with these functions, we'll explore three examples.

    Adorning a Connector

    We've seen shape developers create connector adornments to convey additional information. With the Point Along Path functions, this is now easier than ever to do.

    Here's a simple triangle shape that sits at the midpoint of the connector, and changes direction with the connector. It works with curved and right angle connectors:


    To create this adornment, you only need a few ShapeSheet formulas:

    • First, make sure that the adornment shape will be ignored by the Visio routing engine. To do this, select the shape, and click "Behavior" from the Developer tab. In the ensuing dialog, click on the "Placement" tab, and ensure that placement behavior is set to "Do not lay out and route around".
    • Create a user cell in the adornment shape (we'll call it User.ConnectorGluePoint, and use the POINTALONGPATH() function and reference the connector that the shape will adorn:
      • POINTALONGPATH(Dynamic connector.23!Geometry1.Path,0.5)
      • This returns a point in local coordinates to the connector
    • Create another user cell, User.PageCoord, and use the LOCTOPAR() function to translate the local coordinates to page coordinates:
      • LOCTOPAR(User.ConnectorGluePoint,Dynamic connector.23!User.msvThemeColors,User.msvThemeColors)
      • The LOCTOPAR function needs cell references for the source and destination of the translation. Here we arbitrarily use User.msvThemeColors because the property exists in both the source and destination.
    • Now, set PinX,PinY, and Angle cells on the adornment shape accordingly (found in the Shape Transform section):
      • PinX: GUARD(PNTX(User.PageCoord))
      • PinY: GUARD(PNTY(User.PageCoord))
      • Angle: ANGLEALONGPATH(Dynamic connector.23!Geometry1.Path,0.5)-PI()/2
        • We subtract PI/2 because we’re using a triangle and the point is not aligned with the 0 angle. The ANGLEALONGPATH() function returns the tangent angle to the specified point on the path.

    Finding the Nearest Point on a Path

    You can use the NEARESTPOINTONPATH() function to find the coordinates of a point along a path that is closest to a given point. In the picture below, the triangle shape is showing the nearest point along the path to the center of the circular shape:

    nearest point

    Here’s how we setup the triangle to do this:

    • Create a user cell in the triangle shape to store the point of the circle shape (we’ll call it User.LocalPoint) Use the following formula to transform the LocPin point of the circle into local coordinates relative to the curve:
      • LOCTOLOC(PNT(Circle!LocPinX,Circle!LocPinY),Circle!Height,ArcLine!Height)
      • We use the PNT function to turn the LocPinX and LocPinY into a point
    • Create another user cell in the triangle (we’ll call it User.Travel) to store the percentage along the path (the travel) that is nearest to the circle. Use the following formula:
      • NEARESTPOINTONPATH(ArcLine!Geometry1.Path,PNTX(User.LocalPoint),PNTY(User.LocalPoint))
      • This returns the percentage along ArcLine!Geometry1.Path that has the nearest point to the center of the circle shape
    • Create another user cell (we’ll call it User.ArcGluePoint) to store the point along the path of the arc that is closest to the circle. Use the following formula:
      • POINTALONGPATH(Sheet.1!Geometry1.Path,User.Travel)
      • This will return the point on the arc where the triangle should be glued, in local coordinates relative to the arc.

    Just like the example above, you then need to transform the local coordinates, and set the PinX and PinY of the triangle so that its glued to the arc.

    Curved Timelines

    The above two examples illustrate how you can use the Point Along Path functions. As an application of the same concepts above, we built a curved timeline:
    curvy timeline

    As you change the curve of the timeline, the milestone shapes stay attached to the curve, which allows you to create a great looking visual.

    The main difference between this example and the previous one is that we’ve introduced a mechanism for automatically attaching adornments to the arc geometry. Here we turned the arc shape into a custom container to give the milestone shapes a universal reference. Since they are members of the container, we use the CONTAINERSHEETREF() function to reference the geometry of the arc. When you make multiple copies of the milestone shape, their reference to the timeline arc geometry is preserved as long as they are members of the container. (For more info on custom containers, see our previous post ).

    To place the milestones accurately on the timeline arc, we used the POINTALONGPATH() function. Each timeline shape stores its own date. The timeline arc contains the “begin” and “end” dates of the timeline.

    The attached VSD file includes the curved timeline, and the other two examples, so you can take a look at the formulas and play around with them.

    We think these new functions will open up a new set of scenarios for shape developers. Some things you might try to create with them are:

    • Placing text or adornments at fixed distances from the beginning or end of a connector
    • Detecting whether a point is inside or outside a closed path
    • Calculating the lengths of curved paths in a diagram
    • Drawing a line that terminates on a complex path

    As usual, please tell us what you think by using the Send a Smile feedback tool or by commenting on this post.

  • Visio Insights

    Container, List and Callout API in Visio 2010


    This post examines the programmability features for Containers, Lists and Callouts in Visio 2010.  It supplements an earlier post that describes how these special shapes are constructed and how they can be customized.  Collectively these shapes are known as Structured Diagram elements, and the part of the Visio API that manages these elements is known as the Structured Diagram API.  This API enables developers to use Structured Diagram elements in their solutions.  Developers can identify the relationships between these elements and other shapes, they can add or change the relationships with other shapes, and they can detect when the user makes changes to the relationships with other shapes.


    Structured Diagram API Overview

    Here are the key objects, properties and methods in the Structured Diagrams API:


    There are two new objects in the API.  ContainerProperties is an extension of the Shape object.  It encapsulates the special properties and behaviors of containers and lists.  RelatedShapePairEvent is an object used with the Structured Diagram API events, where Visio can describe a relationship being formed or broken between two shapes.  The remaining parts of the API are additions to existing Visio objects.

    Note that lists are just another type of container as far as the API is concerned.  Therefore, lists use all the same objects, properties and methods as containers; and lists have a few additional properties and methods as well (those with “List” in their name).


    Enabling Structured Diagram Behaviors in Solutions

    Visio 2010 introduces a new feature called Diagram Services that manages what diagramming behaviors are enabled in the document.  There are diagram services that control the behavior of Auto Size Page and diagram services that control the behaviors of Containers, Lists and Callouts.  These services are turned on and off at the document level.  When a service is off, changes made in the diagram through automation will not trigger the diagramming behaviors related to that service.  (Changes made through the user interface are not subject to the diagram service state.)

    For example, the Auto Size Page feature will normally grow the page size if a shape is placed outside the page boundary.  However, when a shape is placed outside the page via automation, the Auto Size Page feature will only respond if the Auto Size Page diagram service is enabled.  Similarly, dropping a shape on top of a container will normally make it a member of the container and cause the container to resize to fit it.  However, when the shape is dropped via automation, the Containers feature will only respond if the Structured Diagram service is enabled.

    The reason Visio 2010 includes this capability is that solutions may not always want these diagramming behaviors to get triggered while they are manipulating shapes in the diagram.  This may especially be true for existing solutions that have no knowledge of the new Visio 2010 behaviors and have expectations that shapes respond in ways consistent with Visio 2007.  In order for existing solutions to work as originally designed, all diagram services in Visio 2010 are disabled by default.  Solutions must opt the document in to the new diagramming behaviors.  Note that diagram service states apply to automation properties and methods that existed in Visio 2007.  When a new Visio 2010 automation method is explicitly invoked by a solution - such as any of the examples below – the service state is ignored.  The presumption is that the solution wants the Visio 2010 behavior associated with that method.

    Diagram service states are checked or changed using the Document.DiagramServicesEnabled property.  The value of this property is a mask of all the services currently enabled.  Available services and values are listed in the table below.  It is possible for a solution to opt into just one service, all the services supported in Visio 2010, or even all existing and future services.

    VisDiagramServices values:

    Enum Value Description
    visServiceAll -1 All diagram services
    visServiceVersion140 7 Diagram services that exist in Visio 2010
    visServiceNone 0 No diagram services (default)
    visServiceAutoSizePage 1 AutoSize page behaviors
    visServiceStructureBasic 2 Behaviors that maintain existing Structured Diagram relationships but do not create new relationships
    visServiceStructureFull 4 Structured Diagram behaviors that match the behaviors in the user interface

    There are two services for Structured Diagram behaviors.  The StructureBasic service maintains relationships but will not form new ones.  This might be appropriate for a solution that wants to respect the user’s usage of Containers, Lists and Callouts but does not want the solution itself to inadvertently form relationships when shapes are moved around the page.  The StructureFull service maintains relationships and will form new relationships as well.  This matches the behaviors that are triggered in the user interface.  If both services are enabled, then Visio uses the StructureFull set of behaviors.


    Common Tasks with the Structured Diagram API

    Let’s look at some typical Structured Diagram tasks to explore the API in greater detail.  For a complete list of the special flags that can be passed into the methods, look at the Object Browser within the VBA editor in Visio.

    Add a container to the page

    Containers can be added to a page by calling the traditional Page.Drop method, which will add the shape at coordinates you specify without affecting the membership of existing shapes on the page.  However, there is a new Page method – Page.DropContainer - that will not only drop the container but will also size it around a set of shapes and make those shapes members of the container.  This is the behavior in the UI when using Insert > Container when a selection exists.  DropContainer needs an object for the container shape.  If you want to use one of the shapes in the Insert Container gallery, you can use the GetBuiltInStencilFile method to retrieve the hidden stencil where these containers are stored.

    Dim vsoDoc1 As Visio.Document
    Set vsoDoc1 = Application.Documents.OpenEx(Application.GetBuiltInStencilFile(visBuiltInStencilContainers, visMSUS), visOpenHidden)
    Application.ActivePage.DropContainer vsoDoc1.Masters.ItemU("Container 1"), Application.ActiveWindow.Selection

    Add a shape to a container

    Shapes are added to a container by moving or dropping them onto the container (if the StructureFull diagram service is enabled).  Shapes can be explicitly added to a container using the AddMember method.  This is useful when the shape already overlaps the container and is not yet a member.  It is also helpful if you want to force the container to expand to encompass the new member.

    vsoContainerShape.ContainerProperties.AddMember vsoShape, visMemberAddExpandContainer

    Find the containers on a page

    To discover what containers exist in a document, Visio provides a direct way to get the set of containers in a selection or on a page.  The GetContainers method returns an array of Shape IDs for the containers.  Containers nested within other containers can be included or excluded using flags.

    For Each containerID In vsoPage.GetContainers(visContainerIncludeNested)
        Set vsoContainerShape = vsoPage.Shapes.ItemFromID(containerID)

    Get the shapes in a container

    Solutions can identify the members of a container using the GetMemberShapes method, which returns an array of Shape IDs for the member shapes.  The flags allow certain kinds of member shapes to be filtered out of the array returned.

    For Each memberID In vsoContainerShape.ContainerProperties.GetMemberShapes(visContainerFlagsDefault)
        Set vsoShape = vsoPage.Shapes.ItemFromID(memberID)

    Reorder a list

    Every member of a list is placed in a specific position, and that ordinal value can be retrieved with the ContainerProperties.GetListMemberPosition method.  To reorder a member, you can call the ContainerProperties.ReorderListMember method.  Both methods use 1 to indicate the first position in the list.

    vsoListShape.ContainerProperties.ReorderListMember vsoShape, 2

    Add a callout to the page

    Callouts can be added to a page by calling the traditional Page.Drop method, which will add the shape at coordinates you specify.  However, there is a new Page method – Page.DropCallout - that will not only drop the callout but will associate it with a target shape and position it near the target shape.  This is the behavior in the UI when using Insert > Callout when a selection exists.  As with DropContainer, DropCallout needs an object for the callout shape.  If you want to use one of the shapes in the Insert Callout gallery, you can use the GetBuiltInStencilFile method to retrieve the hidden stencil where these containers are stored.

    Dim vsoDoc1 As Visio.Document
    Set vsoDoc1 = Application.Documents.OpenEx(Application.GetBuiltInStencilFile(visBuiltInStencilCallouts, visMSUS), visOpenHidden)
    Application.ActivePage.DropCallout vsoDoc1.Masters.ItemU("Callout 1"), vsoTargetShape

    Get the target shape for a callout

    A shape can have multiple callouts, but a callout can have only one target shape at a time.  The Shape.CalloutsAssociated property returns an array of callout shape IDs.  You can get or set the target shape of a callout using the Shape.CalloutTarget property.

    Set vsoShape = vsoCalloutShape.CalloutTarget

    Structured Diagram Events

    In addition to manipulating the containers, lists and callouts in a document, you can also respond to user actions that relate to these shapes.  Containers, lists and callouts work by establishing relationships with other shapes.  Visio fires an event whenever one of these relationships is formed or broken.  For example, adding a shape to a container forms a new relationship between the shape and the container.

    When a relationship event fires, Visio specifies the details in a RelatedShapePairEvent object.  The FromShapeID property of this object indicates the container, list or callout involved in the relationship.  The ToShapeID property indicates the other shape involved in the relationship.  Thus when adding a shape to a container, the ToShapeID would refer to the new member shape, and when associating a callout with a target shape, the ToShapeID would refer to the target shape.

    The following events are available for Application, Documents, Pages and Page event lists:





    Also the ShapeChanged event will now fire when members of a list shape are reordered.  The event passes the list shape as an argument and includes the string “/ListReorder” in the EventInfo argument.



    The Structured Diagrams feature set – Containers, Lists and Callouts – offers both end users and developers significant new diagramming capabilities in Visio 2010.  We’re interested to hear what developers think of this API functionality, so please use the Send a Smile feedback tool or leave a comment below.

  • Visio Insights

    New Visio 2010 API for Configuring Raster Export


    When we talk to developers to get their feedback on the Visio development platform, a common request we hear is the ability, through the API, to control the settings used when exporting a diagram as a raster image in the PNG, JPG, BMP, or TIFF format. Typically, they want to automate the export of the pages in a document as images for use in a web page or other application that requires certain settings. In this post, we’ll talk about the additions to the Visio 2010 object model that let developers configure each of these raster export settings.

    When you save a diagram in one of the raster formats, a dialog box appears to let you configure various settings, such as the color format, resolution, or size of the image. For example, this is the dialog for the PNG format:


    Until now, there hasn’t been a way to automate the settings in this dialog via the API. In Visio 2010, we’ve enhanced the object model to make it possible to drive these settings programmatically using a set of new methods and properties on the ApplicationSettings object. You can use the methods to get and set the raster-export resolution and size, and you can use the properties to get and set raster export attributes such as data format, data compression, color reduction, color format, background color, transparency, and quality. You can use these methods and properties with the existing Page.Export and Selection.Export methods to export a diagram in a raster file format.

    Here is the complete list of new raster export methods and properties on ApplicationSettings:





    Returns the raster export resolution settings.


    Gets the raster export size.


    Specifies the raster export resolution settings.


    Sets the raster export size.






    Determines the background color that is applied to the exported image.


    Determines the color format that is applied to the exported image.


    Determines the color reduction that is applied to the exported image.


    Determines the data compression algorithm that is applied to the exported image (BMP, TIFF).


    Determines whether the exported image is interlaced or non-interlaced (PNG, GIF).


    Determines the flip that is applied to the exported image.


    Determines the export operation that is applied to the exported image (JPG only).


    Determines the export quality that is applied to the exported image (JPG only).


    Determines the rotation that is applied to the exported image.


    Determines the transparency color that is applied to the exported image (PNG, GIF).


    Determines whether Visio applies, to the exported image, the transparency color that is specified in the RasterExportTransparencyColor property (PNG, GIF).

    For more details on these methods and properties, such as their parameters and constants, see the Visio Developer Reference in the Visio 2010 Beta.


    This VBA code executes the settings in the PNG Output Options dialog box as shown above and exports the diagram as a PNG:

    'Set the export resolution to the printer resolution at 600 x 600 pixels/inch
    Application.Settings.SetRasterExportResolution visRasterUsePrinterResolution, 600#, 600#, visRasterPixelsPerInch

    'Set the export size to custom 8 x 5 inches
    Application.Settings.SetRasterExportSize visRasterFitToCustomSize, 8#, 5#, visRasterInch

    'Set the data format to Interlace
    Application.Settings.RasterExportDataFormat = visRasterInterlace

    'Set the color format to 24-bit color
    Application.Settings.RasterExportColorFormat = visRaster24Bit

    'Rotate the image to the left
    Application.Settings.RasterExportRotation = visRasterRotateLeft

    'Don’t flip the image
    Application.Settings.RasterExportFlip = visRasterNoFlip

    'Set the background color
    Application.Settings.RasterExportBackgroundColor = 14798527

    'Set the transparency color
    Application.Settings.RasterExportTransparencyColor = 13269045

    'Use the transparency color
    Application.Settings.RasterExportUseTransparencyColor = True

    'Export the active page as a PNG to the specified path
    Application.ActiveWindow.Page.Export "<drive>:\<path>\Network Diagram.png"

    We hope these additions to the API for raster export open up some new possibilities for Visio developers, or at least make it easier and more efficient to build automated solutions. Let us know what you think by commenting on the blog or using Send a Smile.

  • Visio Insights

    Better Layout Using Dynamic Glue


    Visio makes it easy for users to place shapes anywhere and provides connectors for maintaining connections between shapes.  However, as diagrams get more complicated, users often look to Visio for help organizing shape placement and connector routing on the page.  Unfortunately, while Visio's automatic layout functionality is quite powerful, many times the results are not good enough without tweaking the layout settings.  In this post we'll look at one such scenario and try making a few changes to improve the final results.

    Here is a custom shape with several connection points on each side.  Connectors are intended to glue to these points on the shape.

    A diagram is created using this shape and connectors are added.

    We now would like Visio to rearrange the shapes and reroute the connectors to create a cleaner, more readable diagram.  Choosing Shape > Re-layout Shapes gives this result:

    This result is not ideal.  There are still overlapping connectors and too many bends.  Visio is actually constrained by the way the connectors were glued to the shapes.  The traditional way to glue connectors is to drag the end of the line to a connection point on the shape.  This creates what is known as static glue in Visio.  The connector remains associated with that connection point.  Static glue has drawbacks for layout because it prevents Visio from routing to the nearest side of the shape.  An alternative is using dynamic glue.  To glue using dynamic glue, drag the end of the line to the center of the shape.  A red outline rectangle will appear to indicate dynamic glue.  The resulting red glue square has a slightly different look as well.

    By switching all the connections over to dynamic glue, Visio can choose more efficient routes for the connectors.  However, now Visio routes to locations on the shapes that we do not want.  Our custom shape is not supposed to allow connections on the top or bottom.

    There is a Shapesheet cell that allows us to set some restrictions on dynamic glue so that Visio will not choose any arbitrary location to connect.  The Shape Layout section has a cell named ShapeFixedCode that determines how connections can be made to a shape.  By setting ShapeFixedCode to 64 on the custom shape we can force Visio to connect at connection points.

    Now the automatic layout keeps the connectors glued to the connection points.  Note that the glue style is still dynamic glue.  Visio is free to choose which connection point is used for each connection.  The result is better but still not ideal.  There are still too many bends in the connectors as Visio must work in and around the shapes.

    One final change can clean this layout up.  Each drawing page has a default layout spacing, but the shapes you use in the drawing may not be suitable for that default.  In this example, the default drawing spacing is 0.375 in. while the custom shape size is 1.25 in. x 1 in.  That pushes the shapes too close together.  By increasing the spacing between shapes, Visio can find better routes for the connectors.  This is done in the Shape > Configure Layout dialog.

    The end result is a much simpler arrangement with clean connector routes.

    Dynamic glue adds flexibility to Visio's layout and routing optimizations and will result in a better looking diagram.  The tradeoff is the inability to specify particular connection points for connectors.  Visio assumes all connection points are equally valid.  Hopefully the techniques presented in this post help you get better layout results.  It is unfortunate that Visio's automatic layout needs this much tweaking to get good results, but it is challenging for a layout engine to produce optimal results across a huge variety of drawing types.  As always, tell us your pain points, and we will try to address them in the future.


  • Visio Insights

    Sizing Text with Shapes


    We occasionally get questions about how to size shapes to text or text to shapes.  While most Visio shapes do not behave like this by default, both cases are made possible through ShapeSheet formulas.  In fact, Visio includes some shapes that resize based on their text.  Go to File > Shapes > Visio Extras > Callouts and try out the shapes near the top of the stencil.  Let’s look at how to make a shape resize its text based on its width or height.


    First, select a shape on the page.  We’ll start with a simple Process shape from the Basic Flowchart stencil.  Open its ShapeSheet by choosing Window > Show ShapeSheet.  Visio opens a new window that shows the properties that drive the shape’s behavior.



    In the ShapeSheet window, scroll down to the Character section.  The Size cell is set to “8 pt” which matches the text size shown in Visio’s Formatting toolbar.



    Let’s say 12 pt is the baseline size we want for our text at the shape’s current size of 1 inch by 0.75 inch.  We want the text to size with the width of the shape.  A simple formula in the Size cell achieves this.



    This scales a base size of 12 pt by the width of the shape.  (Width is the name of a cell in the Shape Transform section, at the top of the ShapeSheet.)  Our shape’s text is now 12 pt.  Note that if we do not specify a unit, Visio assumes a default that is appropriate for the locale.  Multiplying by 1 pt scales the Width to points.



    If the shape is stretched to twice its original width, the text becomes 24 pt.



    What if we want the text to also size with height?  What if we only want the font size to change in increments of 2 points?  We just need to change the formula.  This formula scales the text size based on the larger of the two dimensions in 2 pt steps.



    We don’t want to lose this formula when manually setting a font size using the Formatting toolbar.  Wrapping the formula in a GUARD() will prevent it from being changed, even from the toolbar.  The SETATREF functions offer ways to combine formulas with changes made through the user interface, but are a bit more complex to use.


    All of the ShapeSheet cells and formulas are described in the Visio SDK documentation – downloadable or online at MSDN.  In a future post, we’ll look at the reverse of this behavior, how to resize shapes based on the text they contain.



  • Visio Insights

    Sizing Shapes to Text


    In a previous post, we saw how to use the ShapeSheet to resize text based on a shape’s size.  A related question we sometimes hear is how to make a shape automatically resize to contain its text.  Visio includes some shapes that resize based on their text.  Go to File > Shapes > Visio Extras > Callouts and try out the shapes near the top of the stencil.  Let’s see how to build this into a shape.

    People often want to fit more text into flowchart shapes.  We can make the text smaller for shapes that cannot fit all the text, but this sometimes makes diagrams difficult to read.  In other cases, it is OK to resize shapes based on the amount of text they contain.  Let’s say we have this piece of a process flowchart.

    The size of the Document shapes is unimportant, so we can create a formula to control the height of the shape.  Select the shape and open its ShapeSheet by choosing Window > Show ShapeSheet.  Visio opens a new window that shows the properties that drive the shape’s behavior.

    The shape is taller, but the text still doesn’t fit right.  In this case, the Document shape is designed to keep the bottom of the text block above the rounded part of the shape, preventing it from being obscured.  We can just add a little buffer to the height of the shape.

    But if the shape is resized manually by adjusting the green handles shown when the shape is selected, the formula will be lost.  We want the shape to always be at least as tall as the text it holds.  We can use the SETATREFEXPR formula to “pick up” the height that is set by manipulating the green handles.  Then, use MAX to compare that to the height from the formula above and use the larger of the two.

    The shape still looks the same, but now if we resize the height manually, the formula is not lost.  And if we try to make the shape smaller, Visio only allows it to shrink small enough to contain all the text.

    If this formula were applied to all Document shapes, each one would be a different size based on the amount of text it contains.  We can add a condition that keeps the shape at least as large as it was originally.  With this, shapes may resize larger but never smaller.  Another MAX condition ensures that Visio chooses the largest of the original size (0.75 in.), the calculated size and the manually set size.

    The SETATREF trio of functions can be a little tricky to learn, but contain a lot of power for building formulas that interact well with manual changes made through Visio’s user interface.  More on these in a future post.


  • Visio Insights

    Building Shapes the Easy Way


    Shape design is somewhat of an art in Visio.  There are so many things that go into creating professional-looking content that a certain level of expertise is required.  One of the goals of the Visio Insights blog is to provide that expertise in an understandable format.  Another goal is to demonstrate best practices to help you use Visio in the most effective manner.  This week we will demonstrate shape construction techniques by  creating a new shape from scratch.


    Our example is a digital clock shape.  The numerals in the clock – the digits – are drawn in geometry instead of text.  This allows us to be more creative with the appearance of the digits.  We want the digit to appear as it is shown in a Liquid Crystal Display.



    Today’s post focuses on ways to use the power of Visio to create shape geometry.  There are several approaches to constructing geometry.  You can use Visio’s drawing tools to manually draw the lines and arcs needed for the shape.  This works well for simple geometry, but the tools are not suitable for complex geometries.  You can also build geometry using the Shapesheet window by entering the actual formulas in the Geometry sections.  This approach is very precise but can be extremely slow and difficult to get things right.  A third approach is to build a complex shape by assembling it from simpler pieces.  This is the simplest approach because it makes Visio do the heavy lifting to create the final geometry.


    Let’s construct a shape to represent a digit for our clock using this assembly approach.  A digit is composed of seven individual polygons, which are shown or hidden to generate each possible numeral.  These polygons have tiny gaps separating them.  Also a slight rounding is applied for aesthetics.  We start by drawing a rectangle 1/2 in. wide by 1 in. tall.  Then we use the Offset command found in the Shape > Operations menu to create two additional rectangles 1/16 in. away from the original shape.  The outermost rectangle is not needed, so it is deleted.  We select the remaining two rectangles and use the Subtract command from the Shape > Operations menu to create a single shape with its middle removed.



    The crossbar is added by drawing a rectangle 1/2 in. wide by 1/16 in. tall and positioning it in the center of the existing shape.  A composite shape is created by selecting both shapes and choosing the Union command from Shape > Operations.  Note that commands such as Union and Subtract destroy the selected shapes and generate a brand new shape with the composite geometry.  For this reason, you should create the geometry of a shape before moving on to other aspects like formatting or behavior.



    Next we need to segment the shape into seven pieces with small gaps in between.  We draw lines in the places where we want the gaps to be located.  The lines extend beyond the shape geometry to facilitate the next shape operation.  Getting the lines in exactly the right place may require zooming in very close.  Otherwise Visio’s snapping behavior may prevent you from placing your cursor where you want it.  Once all the lines are drawn they need to be selected.  This is accomplished by selected all the shapes and then Shift+clicking on the digit shape to deselect it.  Then the Offset command is run with a spacing of 0.015 in.



    The offset lines serve as break points where the underlying digit shape must be segmented.  The segmenting is done using the Fragment command in Shape > Operations.  This command uses all the selected geometry to define simple closed polygons.  We can apply a green fill to the resulting shapes to better see them.  The inside squares are deleted first.  Then the tiny corner polygons are deleted, leaving only the seven segments for our digit.



    We now have seven individual shapes that make up our digit.  By selecting the shapes and choosing the Combine command in Shape > Operations, the seven shapes are converted into a single shape containing seven geometry sections.  This is a much more compact representation of the digit - decreasing file size and improving performance.  Corner rounding of 0.02 in is applied to the shape as a final touch.



    While there were several steps to get to the end result, we never had to do any complicated drawing or Shapesheet formula entry to construct this shape.  Two rectangles were drawn for the basic digit outline.  Then eight lines were drawn to define break points for the segments.  Visio’s shape operation commands did the rest of the work.  In the next post, we’ll add some smarts to this digit shape and use it to build up our digital clock.



  • Visio Insights

    Introducing the Bubble Chart


      A Bubble Chart is a diagram that presents multi-dimensional data in a graphical form.  Each data field is tied to a particular visualization.  Most often data controls the Size and Position of elements in the chart.  Thus the diagrams often resemble a bunch of bubbles.  Taken to an extreme, data can be visualized in almost any way such as Color, Shape, Line Thickness, Shadow or any other formatting.  As the data grows more complex, it becomes more important to find effective ways to present it.  Bubble charts offer a compact graphical way to present information.


      Bubble Chart 


      Over the next few posts we will build our very own Bubble Chart stencil.  Using the custom Bubble Chart shapes in combination with the Data Link and Data Graphics features of Visio 2007, it is possible to generate Bubble charts from data in just a few steps.  In this post we look at the finished solution from a user perspective.  The Bubble Chart stencil is included as a file attachment to the post.  In subsequent posts, we create the stencil from scratch.  Understanding the details of construction will let you customize the solution if you desire.


      Using the Bubble Chart stencil

      To make a bubble chart, you need the BubbleChart.vss stencil and a data source with data in specially labeled fields.  Here is an Excel spreadsheet with the data we will use.  Note the column headings: Label, X, Y and Size.  Our bubble chart shapes are designed to pull information from fields with these names.




      To begin, start a new blank drawing and open the BubbleChart.vss stencil.  Go to Data > Link Data to Shapes to import the data from Excel.  In the Data Selector wizard, choose Microsoft Excel Workbook.  Then browse to the Excel file and click Finish.  The data appears in the External Data window.




      Next drag the Bubble Chart shape onto the page.  This shape forms the chart background.  It includes labels for the title and axes.  The chart shape defines the space where bubble shapes will be placed.  As the chart is moved or resized, the bubble shapes will reposition accordingly.  Dropping the shape automatically triggers the Shape Data dialog.  Fill in the ranges and labels for each axis.  The last Shape Data field is Max Size.  Enter the largest Size value you expect in your data.  Visio will scale the bubbles to make the largest size equal to 1 inch on the page.




      Now we are ready to add the bubbles.  Select the Bubble Data shape in the Shapes window, but do not drag it onto the page.  Instead click on a row in the External Data window and press Ctrl+A to select all the data rows.  Then drag the rows onto the page.  Data Link drops new Bubble Data shapes and automatically links them to the data.  The bubble shapes are placed into the chart according to their data values.  The Label and Size fields are displayed as data graphics.  The diagram is complete!  You can even use the Data Refresh feature to quickly update the diagram when the Excel data changes.


      Connect to your data set.  Add the Bubble Chart shape.  Select the Bubble Data shape and drag out all the data rows.  Instant diagram.  Next time we'll see how to build the BubbleChart.vss stencil to make it happen.


  • Visio Insights

    Visio Mailbag


    We on the Visio product team receive lots of interesting questions from Visio users through our blog’s contact form. In this post, we’ll share our answers to several questions that we thought would be of interest to our blog readers.

    Q: I installed Visio 2010, but the BPMN shapes appear to be missing. Where can I find them?

    A: The BPMN shapes are part of Visio Premium 2010. You can check what edition you have by going to File > Help and looking in the top right.

    Here is a link to the feature set for each Visio edition:


    Q: If I add hyperlinks to my Visio drawing, will they still work after using Visio Web Access to display them on a SharePoint page?

    A: Yes, hyperlinks will work in the Visio Web Part. Here are some more details:

    • You can hyperlink to web URLs as well as other Visio pages in the document.
    • If you have multiple hyperlinks on a shape, clicking on the shape will open the topmost link or the “Default” link.
    • Pressing Ctrl and clicking on a shape will open the Shape Data pane and select the shape. This will show you all the hyperlinks, and you can click each one.


    Q: I upgraded to Visio 2010 and am having difficulty finding the Shape Operations (Union, Combine, Fragment, Intersect, Subtract, Join, Trim, and Offset). Where are they?

    A: In Visio 2010, Shape Operations have been moved to the Developer tab of the Ribbon, which you can enable by turning on Developer mode in Visio Options:


    Once this is done, click on “Operations” in the Developer Tab to get the menu of operations:



    Q: I am creating a Visio 2010 Cross-Functional Flowchart. How can I select an individual band to specify its color fill?

    A: The easiest way to select a band (also called swimlane) is to click on its text heading, so that you see a dotted outline around the swimlane. You can then choose a fill color, and that will apply to the heading portion of the band, as follows:


    To apply the fill to the body of the swimlane, go to the Cross-Functional Flowchart tab in the Ribbon and select a style in the Style gallery that has a fill:


    This lets you color the whole swimlane as follows:


    Q: Where can I get support for Visio or report a problem?

    A: The central support place for Visio is the Visio Solution Center.  It allows you to get product information, get self-support or community support, or contact a support representative.

    If you simply want to report a problem, you can choose one of the community support options such as the forums or our contact form. If you want help finding a resolution, you should choose the forums or contact a support representative.

  • Visio Insights

    Visualizing Operations Manager Data in Visio Services


    We enjoy seeing the innovative solutions that are implemented on the Visio platform. Now, with Visio 2010 and Visio Services, we’re starting to see some great new solutions that weren’t possible before. A good example is the Visio 2010 add-in for System Center Operations Manager 2007 R2. This add-in, which was originally released for Visio 2007, lets you generate a data-linked Visio diagram from Microsoft System Center Operations Manager. Visio’s data graphics are used to show the health of applications, services, and infrastructure monitored by Operations Manager. For instance, the status of a database server can be shown with an icon on the shape or by changing the shape’s color.


    The diagram can be customized in Visio to show the information in a variety of contexts, such as a network topology, datacenter floor plan, rack diagram, or map.

    The latest version of the add-in has been updated to work with Visio 2010 and allows the diagram to be viewed in SharePoint using Visio Services. The diagram remains connected to the Operations Manager data, and the data graphics will update as status changes occur. In this way, it can be used as a live dashboard that is viewable in a browser without requiring the Visio client.


    In short, this add-in demonstrates how Visio Services opens up new scenarios for visualizing real-time data in the browser and how Visio developers and partners can build powerful new solutions that take advantage of Visio Services.

    Please continue to let us know what you think and comment on our blog!

  • Visio Insights

    Visio 2010 Release to Manufacturing


    Today Microsoft announced that Microsoft Office 2010, SharePoint Server 2010, Project 2010 and Visio 2010 have released to manufacturing! As noted last month, Visio 2010 and the rest of the other Office 2010 products will be available to businesses worldwide on May 12th and to consumers online and on retail shelves this June. Many thanks to everyone who provided product feedback on our blog and through our Send a Smile tool in our Visio 2010 Beta. Your feedback has helped us ensure a high quality product as well as provided us feature input for future consideration. We hope to continue hearing from you after you install our final release.

    Over the last nine months, we have had an opportunity to cover the features of Visio 2010 over nearly 60 postings with information for users, shapes developers, IT professionals and developers. If you have recently started reading our blog or if you just want an easy reference to what we’ve already covered, below is a summary of the articles we’ve posted to date, organized by our main areas of investment for this release.

    Ease of Use

    Process Management

    Visio Services

    Office Fluent User Interface

    Visio Application Enhancements

    Diagramming Improvements

    Technical Reference


    Structured Diagrams

    SharePoint Server 2010 Integration

    Technical Reference

    Diagram Publishing, Rendering and Data Refresh

    Technical Reference

    As always, please continue to let us know what you think or want to hear more about.

  • Visio Insights

    How to create a strategy map using containers


    The new Containers feature in Visio 2010 is great for adding structure and organization to Visio diagrams. In this post, we’ll walk through the creation of one diagram, the strategy map, which is easy to make using containers.

    The strategy map

    A strategy map is a way for companies to document their primary strategic objectives. It visually shows the goals being pursued by an organization and the relationships between these goals. Commonly, a strategy map is part of the documentation associated with the Balanced Scorecard, a framework used to help design and implement strategic performance management tools.

    A strategy map typically consists of three components:

    1. Objectives, representing the goals that the organization is pursuing,
    2. Perspectives, representing broad categories for classifying the objectives, and
    3. Arrows, representing causal relationships between objectives.

    It’s easy to build a great-looking strategy map in Visio 2010. Here’s a walkthrough of how we built the strategy map below.


    Getting started

    Since the shapes in a strategy map are simple geometric shapes, we started with the Basic Diagram template located under the General template category on the New tab of the Microsoft Office Backstage View.

    Once we had a blank diagram, we did some simple steps to get the page ready for the strategy map:

    1. On the Design tab, we changed the Orientation to Landscape.
    2. On the View tab, we unchecked the Grid checkbox.

    This gave us a blank page with the correct orientation and grid lines turned off.

    Adding perspectives

    In a strategy map, objectives are organized into different perspectives. Traditionally, these perspectives focus on the areas of finance, marketing, process and organizational development. Using this convention, we started by creating "Financial", "Customer", "Internal Business Processes", "Learning & Growth” perspectives. These are best represented in Visio using containers.

    To get our first container on the page and formatted, we performed the following steps:

    1. On the Insert tab, we picked a container from the Container drop down menu. 
    2. We selected the newly inserted container and resized it to the desired dimensions.
    3. On the Container Tools contextual tab, visible only when a container is selected, we used the Automatic Resize drop down menu to select No Automatic Resize.

      Tip: Turing off Automatic Resize is good for situations where you have many containers on the page that must be the same size. This prevents the containers from expanding to fit new shapes.

    4. We copied the container three more times, then positioned and labeled the containers.

    The foundation for the strategy map was now complete.


    Adding objectives

    Objectives are the goals that the company identifies as areas of focus. Typically, each objective is represented by text appearing within a shape.

    For our diagram, we picked a different shape to represent the objectives in each perspective. We picked the Ellipse shape for financial objectives, the Star 5 shape for customer objectives, the Rounded rectangle shape for internal business processes objectives, and the Rectangle for learning and growth objectives.

    As we added shapes to the diagram, the dynamic grid made it easy to ensure that shapes were dropped on the page evenly space and centered.


    Tip: You can also use the Position functionality on the Home tab to ensure that shapes are perfectly aligned.


    At the top of the first perspective, we wanted to add some overarching goals for the company. We thought that these objectives would look best as upside-down triangles. We added a Triangle shape to the page, resized it and used the knob at the point of the triangle to rotate the shape.


    Then, we added text.


    Notice that the text was still upside down. On the Home tab, there is a Text Block tool for rotating text. With the tool turned on, a knob appears for rotating text. We used this tool to rotate the text. Once the text is rotated, remember to go back to Pointer Tool mode by selecting the Pointer Tool in the same ribbon chunk.


    When we had one upside-down triangle, we used copy and paste to create two additional triangles.


    Adding a background, theme and title

    Using the Text Box tool on the Insert tab, we added a title and subtitle for the diagram.

    Then, we wanted to add some color and formatting to the diagram. The first two things that came to mind were a background and a theme. We added these using the following steps.

    1. On the Design tab, we selected the Backgrounds drop down and picked the Horizontal Gradient background.
    2. Also on the Design tab, we selected a theme for the diagram.


    The diagram above shows themes being live previewed. As the cursor moves over each thumbnail in the gallery, the theme’s formatting is previewed on the diagram. This lets you quickly experiment with various looks without forcing you to commit to the change.

    Adding graphics

    The Department, Work Flow Objects, Work Flow Steps, and Landmark Shapes stencils have a number of useful people, building and work-related shapes that will help add character to a diagram. You can open the Department stencil by clicking on More Shapes fly out in the area above where the shapes are displayed, then clicking Flowchart, and then clicking the Department stencil. The Work Flow Objects and Work Flow Steps stencils are also under the same Flowchart menu.


    We used a number of different shapes from the Department stencil, including the International division, Headquarters, Finance, and Operations shapes. We also used the Customer shape from the Work Flow Objects stencil and the Research shape from the Work Flow Steps stencil.

    To find different building types, we opened the Landmark Shapes stencil by clicking on More Shapes fly out, then clicking Maps and Floor Plans, then Map, and then the Landmark Shapes stencil. We used the Warehouse shape from this stencil.


    More shape customizations

    At this point, the diagram was mostly built, but the diagram still needed a bit more personality.

    We wanted to show that there are two main types of the objectives inside the internal business processes perspective. The first three objectives are related to “Standardized Execution”, while the last two objectives are related to “Manage for Innovation”. This was another occasion suited for containers.

    We selected the shapes to go in the container and inserted a container using the Container drop down on the Insert tab. The container was inserted around the selected shapes. Even though the shapes were already on the page, it was no trouble to get them grouped in a container.


    We were quickly able to add a second container and then label them both. On the Home tab, we used the Align Left button in the Paragraph chunk to move the title text to the left of the container. Notice that the shape changed slightly to adapt to the new text position.


    Tip: After a container is inserted on the page, it is still easy to change its look. On the Container Tools contextual tab, visible only when a container is selected, you can select a new style for the selected containers.

    To add some additional polish, we updated the fill, line and shadow properties on the shapes. We also changed the font, and added bold to some of the text in objectives. All these options can be accessed in the Home tab. Finally, we repositioned some the shapes so that the graphics did not overlap with the objectives.

    Tip: If you have formatted one shape and want other shapes to have the same formatting, you can use the Format Painter. Select the shape with the desired format, click the Format Painter button on the Home tab, and then click the shape that needs formatting. Voila! Both shapes have the same formatting.


    Adding connectors

    The last step was adding connectors to the diagram to show causal relationships between objectives. We used the Connector tool on the Home tab to add the connectors. In some cases, we took advantage of the connection points on the containers, instead of connecting directly to objectives.

    To make the connectors look stylized, we went to the Design tab, clicked on the Connectors drop down, and then clicked Curved Lines.


    Since no shapes were selected, this action updated all the connectors in the diagram to curved connectors. Note that we could have also decided to apply the style to a specific set of connectors by selecting these connectors before applying the style.


    We then increased the line weight, added a shadow to the line, and changed the color slightly to make the connectors slightly easier to see. We could have made them even bolder and brighter, but decided not to make them the main focus of the diagram.


    To reduce the number of connectors in the diagram, we also added two Triangle shapes to the bottom perspective to show that multiple objectives in this area had the same causal relationships.

    The final diagram

    Before long, we had the strategy map shown below.


    This strategy map shows business objectives, their associated perspectives and the causal relationships between them. It was easy to create in Visio 2010 using basic geometry shapes, graphical shapes for emphasis, containers and connectors. If you want to download this strategy map, it is available here.

    If you have any questions or feedback about this post, feel free to comment on the blog and let us know.

  • Visio Insights

    Microsoft Office Visio 2007 Released


    Yesterday Visio 2007 was made available to business customers along with the rest of the 2007 Office System.  Retail availability for Visio 2007 will be January 30, 2007.

    What’s so great about Visio 2007? 

    Our primary investment focuses on visualizing business information.  We’ve made it significantly easier to bring your business data into Visio and visualize it in a diagram.  Data Link is a new feature that imports data from external sources and associates that data with individual shapes in the drawing.  Data Graphics is a new feature that surfaces your data in graphical ways.  Combined with the ability to refresh from the data source, these features turn your Visio diagram into a living document.

     Data Link and Data Graphics


    While Data Link helps you add data to your existing diagram, Visio 2007 introduces a new drawing type called PivotDiagrams.  Similar in concept to Excel PivotTables, PivotDiagrams dynamically present tabular data in a hierarchical form.  By pivoting on different columns in the data, the diagram changes to aggregate information based on the breakdown specified.   PivotDiagrams are a great way to explore large data sets and present meaningful information visually.



    Visio 2007 also makes it easy to communicate with your audience.  A new Themes feature provides one click formatting to drawings, giving them a professional appearance.  Publish as PDF or XPS lets you distribute diagrams in a fixed format.  Also Outlook 2007 has the Visio Viewer built right in.  Sharing Visio drawings has never been easier.


    Links to More Information

    There’s much more to this release, and there are a number of resources already available to showcase what’s new.  Start with Microsoft Office Online and then look at MSDN and the other Visio blogs.

    Visio page on Office Online -


    There are some great videos on the site demonstrating many of the new features:

    Video demos -


    For shape designers and developers, look for information on MSDN.  There are some good technical articles explaining what is new in automation and how to make use of the new features.

    MSDN Visio site –

    Visio 2007 SDK -


    Eric Rockey, Lead Program Manager for Visio 2007, has a blog previewing many of the new Visio 2007 features.

    Eric Rockey’s Visio 12 blog -


    Bill Morein, Program Manager for Visio 2007, has a blog covering data visualization for Visio and includes several posts about the Visio 2007 feature set.

    Bill Morein’s Data Visualization blog -


    Finally, stay tuned to Visio Insights for more information about Visio 2007.  There’s quite a bit to cover.


  • Visio Insights

    Text Control Handles


    Shape control handles offer users convenient ways to take advantage of the intelligence built into the shape by a designer.  Perhaps the most common use for a control handle is to link it to the text on a shape.  While Visio provides the Text Block Tool for manipulating shape text, this tool is not very discoverable (it’s underneath the Text tool in the Standard toolbar) and is cumbersome.  A control handle is a very convenient alternative.  In fact, Visio 2003 has a text control handle built into the default dynamic connector.



    The dynamic connector incorporates a couple of behaviors that you may find helpful in the design of your own shapes:

    ·         The control handle is not shown unless there is actual text in the shape

    ·         The user can use either the control handle or the text block to reposition the text

    Let’s look at the Shapesheet for a dynamic connector to see how these behaviors are implemented.


    The visibility of the control handle is determined by the X Behavior cell.  This cell describes how the control handle should resize with the shape, whether it can be moved at all and whether the control handle is visible.  An IF statement sets the behavior to 5 to hide the handle or 0 to show it.  The conditional statement verifies that the shape has no text or that it is currently not visible.  Note the use of the STRSAME function to check for text.  This is the recommended practice.



    The synchronization of the control handle and text block is accomplished using the SETATREF function.  This is a very powerful and complicated function that needs some introduction.  We’ll look at the basic capability as it is used in the text control handle here, but there is quite a bit more to cover in a future post.

    Consider a typical formula dependency where cell A depends on cell B.  As long as the user modifies cell B, then A and B will both be up to date.  What happens if the user modifies cell A?  This change would blast the formula in cell A, decoupling it from cell B.  You could GUARD the formula in cell A to preserve the dependency on cell B, but now the user cannot manipulate cell A at all.  SETATREF solves this problem by preserving dependencies and forwarding inputs to the independent cell.  SETATREF allows cell A to depend on cell B while also allowing the user to change either A or B.

    In the case of the text control handle, the position of the text block is dependent on the position of the control handle.  Thus the TxtPinX and TxtPinY cells have formulas with references to Controls.TextPosition and Controls.TextPosition.Y respectively.  These references are then wrapped by a SETATREF formula.  To understand how SETATREF works, we need to separate what happens during recalculation versus what happens during cell input.

    Because TxtPinX and TxtPinY have formulas with references to the control handle position, these cells must be recalculated whenever the control handle position changes.  During the recalc operation, the SETATREF function is transparent.  SETATREF(x) = x.  In other words, the result of the recalc is just like if there were no SETATREF wrapped around the cell references.  On the other hand, when the user directly manipulates the TxtPinX or TxtPinY cells (by using the Text Block Tool), SETATREF influences how the new value updates the Shapesheet.  Rather than letting the new cell value replace the SETATREF formula, Visio forwards the value to the cell referenced in the SETATREF function.  Thus any change to the TxtPinX or TxtPinY cell is actually made to the Controls.TextPosition or Control.TextPosition.Y cell instead.  Then the TxtPinX and TxtPinY cells pick up the change through recalculation.

    This ability to preserve dependencies and forward input values is extremely versatile for shape development.  We’ll look at some more sophisticated uses for SETATREF in a future post.


  • Visio Insights

    What’s in a (File)Name?


    This is the second topic in a series discussing the essential features that make up the Visio application.


    Essential Feature:  Drawings, Stencils and Templates

    In the previous post on Drag and Drop, we mentioned that Stencils were separate documents from the drawing and thus Visio has to make a local copy of a master shape when you drag one onto the page.  So what is the difference between a stencil and a drawing?  And what about templates?


    Actually, there is very little difference between these three types of Visio documents.  That's because there is really only one document type in Visio.  Drawings, stencils and templates are the same technically.  The difference is in the “view” of the document information presented to the user.


    Try this: make a simple flowchart by starting from the Basic Flowchart template.  Drag some shapes onto the drawing page from the Basic Flowchart Shapes stencil.  Save the drawing as MyDrawing.vsd and exit Visio.  Now rename the file, changing the extension from 'VSD' to 'VSS'.  Reopen the drawing in Visio.  What do you see?  You should see a stencil with just the master shapes you dragged into your drawing.  Close Visio and change the extension to 'VST'.  Now what do you see when the file is reopened?  You should see your drawing but with a generic filename like Drawing1.


    What's going on?  Every Visio document has a drawing surface - the page that you drop shapes on.  Every document also has a stencil containing masters, called the Document Stencil.  The file extension tells Visio whether to open a document showing the drawing surface or the stencil.  You can see the Document Stencil for your drawing by choosing File > Shapes > Show Document Stencil.  Templates are just like drawings.  The only difference is that Visio will open a template as a copy of the original document by default.  This explains the change in filename.


    Another part of a Visio document is the workspace information.  Whenever you save a drawing, Visio records the names of the stencils that were opened with your drawing.  These stencil documents are automatically reopened the next time your file is reopened.


    Those of you who are familiar with Visio's file format history know that there are now two sets of Visio file extensions.  VSD, VSS and VST are the drawing, stencil and template extensions for Visio's binary document format.  There is a companion set of VDX, VSX and VTX extensions for Visio's XML document format.  The XML document format is a full fidelity peer of the binary format that was introduced in Visio 2002.  The XML formats offer an under the hood view of the contents of a Visio document.  They allow developers to write programs that build new drawings from scratch or read the contents of a drawing – all without having to launch the Visio application.


    Try saving out a drawing as XML and then opening the file in a text editor.  You can rename the file to give it a .XML extension and view it in Internet Explorer too.  There is a lot of information, but if you dig around you'll find the Masters collection that makes up the Document Stencil and the Pages collection that makes up the drawing.  You may even find the workspace information.


  • Visio Insights

    How It All Began


    We're going to wrap up our look at Visio's essential features with the most significant innovation of all - the SHAPE.


    Essential Feature: Shapes

    A central concept in Visio is assembling a diagram from a pre-packaged set of content.  Users do not need to construct drawings from scratch using geometric primitives, nor do they need to be artists to draw great-looking symbols.  You only have to find a shape in one of Visio's stencils and drag it into the drawing.


    Visio shapes differ from Clip-Art in three important ways:


    ·         Shapes are vector-based graphics meaning that they size and scale well (yes, some Clip-Art is vector-based too).

    ·         Shapes can have behaviors that control their appearance or interactivity with the user. 

    ·         Users can customize shapes or build new ones from scratch to easily create new content. 


    We refer to Visio's content as SmartShapes because they react in an intelligent manner when you manipulate them in a diagram.


    There are many, many things to say about designing and using shapes in Visio, but for now let's look at one shape in particular.  Looking back at the history of Visio, you could say it all began with a single SmartShape - the block arrow.



    If you want to see an example of this shape in the current product, open the Basic Shapes template (File > New > Block Diagram > Basic Diagram) and drag out the 45 degree single shape from the Basic Shapes stencil.  There are two special behaviors on this shape.  First, you can stretch the width of the arrow without affecting the size of the arrowhead.  Second, you can control the size of the arrowhead by changing the height of the shape.  These behaviors preserve the 45 degree angle of the arrowhead across a wide range of shape sizes.



    Compare this resize behavior to a standard symbol.  Every arrowhead has a different angle.



    How does this work?  Every Visio shape is actually a collection of properties that are defined using parametric expressions.  Unlike many objects that have properties with static values, a Visio shape has properties with either a static value or a dynamic value that is calculated from a formula.  Other shape properties are often used as parameters in the formula, and that gives the shape its behavior.  For example, I can make a rectangle whose Width property is a function of Height.  If I set Width = Height * 2, then I have made a behavior that changes the Width automatically whenever the user adjusts the Height of the shape.


    Visio shapes have hundreds of properties, each of which can have a formula.  These properties are organized into a spreadsheet interface called the ShapeSheet.  Just as in a spreadsheet, the properties are called Cells in the ShapeSheet.  Cells are organized into rows, columns and sections.  See for yourself.  Select the arrow shape on the page and choose Window > Show ShapeSheet from the menu.  The ShapeSheet Window opens, showing you the real power behind shapes.



    If you look at the ShapeSheet for the 45 degree single arrow shape, you can see some of the parametric formulas that give this shape its special behaviors.  The 1-D Endpoints section tracks the current begin and end points of the arrow.  The Shape Transform section has formulas that depend on the endpoints.  For example, the Width of the shape uses the Pythagorean theorem to compute its value from the endpoints.


    The Geometry section lists the points that make up the line segments you see on the screen.  If you tile the drawing window and ShapeSheet window together (Window > Tile), you can select a cell in the Geometry section and Visio will highlight that point on the arrow in the drawing window.  Notice that all these points are expressed in terms of Width and Height and also a pair of Scratch cells.  The smarts behind this arrow shape are found in the Scratch.X1 cell.  This cell has a formula that determines the correct size of the arrowhead in order to maintain a 45 degree angle.


    One of the best ways to learn how to make shapes is to look at the ShapeSheets of existing Visio shapes.  You can see the formulas those shapes use.  You may just need to customize an existing shape slightly to make the SmartShape you want.  There are thousands of shapes that ship with Visio.  Or you may want to make a shape from scratch incorporating behaviors you discovered in other shapes.  The ShapeSheet is a powerful tool that Visio exposes to all users so that they can create shapes that have the visual appearance users need and behaviors that make diagramming with them easy.


  • Visio Insights

    User Interface Extensibility in Visio 2010


    When Office 2007 was introduced, a new UI paradigm was adopted, and so was a new UI extensibility model, the RibbonX (Ribbon extensibility) model. RibbonX is a XML markup that allows developers to customize the Office UI. It enables 3rd party developers and solution providers to build custom tabs and groups on top of the Ribbon, and target scenarios unique to and optimized for their customers. As Visio 2010 adopts the Fluent UI, Visio developers now also have the opportunity to utilize this platform to build and customize Fluent UI to offer users a more discoverable and instructive UI experience.

    Existing Visio Solutions

    There are two existing mechanisms for UI extensibility in Visio: CommandBar and UIObject. Both would still work in Visio 2010: Visio 2010 automatically creates a new tab called “Add-Ins” with groups for these existing menu commands and toolbar commands and requires no extra work from developers. Here, as an example, we see a top-level menu item called Process Analysis.


    In the Ribbon, this menu becomes a drop-down control that opens to show the menu commands. This automatically-generated tab and its controls require zero-effort for your solutions to migrate to the next release of Visio.

    Although the migration to ribbon can be zero-effort, this really is an ideal opportunity for solution developers to re-think their UI from a Ribbon perspective. The Ribbon provides contextually-relevant commands, and presents them in a way that is more results-oriented. Your UI can integrate more seamlessly with the rest of Visio, and look more like Office. Here is an example of how Visio 2010 reconfigured the Gantt Chart UI, allowing users to more easily discover commands and learn about them through controls of varying sizes, big icons and super tooltips:


    Note, if you are using UIObject in your solution, we especially recommend upgrading to the ribbon. UIObject is a legacy Visio-specific model for defining UI and it may become deprecated in the future.

    RibbonX for Different Types of Add-in Technologies

    Depending on what add-in technology you were using, Visio provides a number of ways to import Fluent UI controls through RibbonX and improve users’ experience. Here is how you achieve that for each type of add-in technology.

    If you’re developing a Visual Studio Tools for Office (VSTO) add-in, you will have access to a visual Ribbon designer that provides a graphical construction environment, similar to other Visual Studio designers. Alternatively, you can specify your UI using RibbonX. Your add-in merely provides an override called CreateRibbonExtensibilityObject that returns an instance of your ribbon object. One-line, very simple to do.

    If you’re writing a shared COM add-in, in your Connect class (the class that implements IDTExtensibility), define an override called GetCustomUI that returns your RibbonX XML as a string. GetCustomUI is the single interface through which the Fluent UI communicates with a COM add-in. Two-to-three lines, still very simple to do.

    VSLs, or legacy Visio add-ons, may also use RibbonX. You add the RibbonX XML to your add-on’s resources. Your add-on defines the GetCustomUI callback and notifies the Visio Application that it has RibbonX XML by calling RegisterRibbonX.

    For VBA, you simply provide the contents of a RibbonX XML as a string directly to Visio through the CustomUI property.

    RibbonX and Visio XML file format

    The Visio XML file format (*.vdx) may also contain RibbonX. The RibbonX markup is stored inside a new element in the Visio XML schema, called, unsurprisingly, RibbonX. The customUI element is the top-level wrapper element in the RibbonX schema.


    Since you can define custom UI directly in the Visio XML file, you have all the benefits of being able to read and write the file without Visio being present. For example, this enables an entire class of server-side scenarios where the server can not only manipulate diagram content, but can also make changes to custom UI in the document.

    Developing with Visual Studio 2010

    The recommended Visual Studio version to develop for Visio 2010 is Visual Studio 2010, which is currently available as Release Candidate. Visual Studio 2010 offers a friendly design environment with the Ribbon Designer, where developers can easily drag and drop ribbon groups and controls onto a graphical design canvas. Also, a Visio 2010 VSTO template is available for you to easily create a Visio add-in project. Multi-project deployment packages, post-deployment actions, and removing PIA dependencies are all benefits from using VS 2010. For more information on what’s new in VS 2010, see this MSDN article.


    With Visio 2010 and the UI extensibility model available, you now have the opportunity to utilize our more intuitive attractive drawing surface to broaden your user base. We highly recommend moving existing solutions to the Fluent UI. It is worth the work to get rid of the old menu bars, and help your users realize the full capability of your solution by making it easier to use. For new and old solution developers alike, Visual Studio 2010 allows a great way to easily develop Fluent UI for Visio 2010 as well.

    To get more details about UI extensibility for Office 2010 applications, here are some helpful links:

    Microsoft Office 2010 Engineering blog

    UI Extensibility in Office 2010- Including details on customizing Office Menu and Backstage View

    MSDN documentation

    Office Development in Visual Studio 2010

    How to setup the Ribbon Visual Designer

    Ribbon best practices

    Do try implementing your own Visio ribbon and send us feedback through the Send a Smile feedback tool or comment on this post!

Page 4 of 8 (181 items) «23456»