Advanced Semantic Zoom


  • Creating a Semantic zoom was easy!


    Although, questions remain towards furtherance of its functionality.


    - How about a 3rd or 4th stage in depth for the Zoom?

    - Using multiple datasources to populate each Zoom State?


    Any other details for further attributes within the data-win-options?


    Any help is greatly appreciated!! Just trying to see what successful

    experiments anyone has had!


    thanks! :)



    				<div id="zoomedOutListView" data-win-control="WinJS.UI.ListView" data-win-options="{dataSource:currentMenu, itemRenderer: semanticZoomTemplate, selectionMode: 'none', crossSlide: 'none' }">



    • Edited by whiteb0x Thursday, November 03, 2011 10:00 PM
    Thursday, November 03, 2011 9:59 PM

All replies

  • I have not tried nesting the semanticZoom. Interesting thought!  When you talk about multiple datasources, what are you asking precisely?
    Jeff Sanders (MSFT)
    Friday, November 04, 2011 6:51 PM
  • Hi, Jeff ! 

    So glad you are here .


     			 Item  > item1, item2, item3 > etc... 
    Categories  >   Item  > item1, item2, item3 > etc...
    			 Item  > item1, item2, item3 > etc...
    			 Item  > item1, item2, item3 > etc...



    ">" representing a semantic zoom state and splitting off into children.


    I suppose I would just need to format my javascript a certain way to 

    parse different items throughout the menu all from a single

    object with a slue of different strings.


    Just a theory really.  wasn't sure if the Semantic Zoom feature was 

    designed to be limited to one state.

    • Edited by whiteb0x Friday, November 04, 2011 9:28 PM
    Friday, November 04, 2011 9:27 PM
  • Hi whiteb0x,

    This was something that I've been thinking about for a few weeks. I did come across some brief comment/discussion about nested semantic zoom. I can't remember where it was, but I will try and find it again.

    From what I can remember, the idea was to redefine the top zoom level and then move down. For example, you have levels 1, 2, 3 and 4. Level 1 and 2 are the two 'regular' zoom levels. When a 3rd level exists, then level 2 is redefined as level 1 and level 3 now becomes level 2 etc. You would need someway to know which levels are above and below your current level or depth. DOM walking maybe?

    Just a thought.

    Will be interesting to see how this progresses.



    Thursday, November 10, 2011 3:08 PM
  • My understanding was that nesting semantic zooms was a violation of the "rules" for Metro apps created by XDR (the experience design team). This may have changed, but it would be worth confirming multiple zoom layers are permitted before proceeding, in case this is an accidental feature that will be removed in future releases.
    Thursday, November 17, 2011 9:02 PM
  • So has anyone tried nesting semantic zooms? I don't seem to be able to do it...
    Wednesday, July 11, 2012 6:56 PM
  • You cannot nest them, sorry!

    Jeff Sanders (MSFT)

    Wednesday, July 11, 2012 7:20 PM
  • You could decide to simply react on the pinch/zoom gesture without using the 2-level SemanticZoom control. That way you could cycle through any number of ListViews/controls...
    Thursday, July 12, 2012 8:46 AM
  • Thanks for your reply... My understanding was that - since you could use semantic zoom between two custom controls, one of the controls could be another semantic zoom control. Just out of curiosity, what are the technical concerns for multiple semantic zoom layers? Thanks!
    Thursday, July 12, 2012 9:01 PM
  • Thanks! I think I will just try this...
    Thursday, July 12, 2012 9:01 PM