Provide a logical view of VM-internal maps in Observatory.

runtime/observatory/lib/src/elements/instance_view.html

 <link rel="import" href="../../../../packages/polymer/polymer.html">
 <link rel="import" href="class_ref.html">
 <link rel="import" href="error_view.html">
 <link rel="import" href="eval_box.html">
 <link rel="import" href="eval_link.html">
 <link rel="import" href="field_ref.html">
 <link rel="import" href="function_ref.html">
 <link rel="import" href="inbound_reference.html">
 <link rel="import" href="instance_ref.html">
 <link rel="import" href="observatory_element.html">
@@ skipping 161 matching lines @@
                 <div class="memberItem">
                   <div class="memberName">[{{ element['index']}}]</div>
                   <div class="memberValue">
                     <any-service-ref ref="{{ element['value'] }}"></any-service-ref>
                   </div>
                 </div>
               </template>
             </div>
           </curly-block><br><br>
         </template>
+
+        <template if="{{ instance.associations.isNotEmpty }}">
+          associations ({{ instance.elements.length }})
+          <curly-block expand="{{ instance.associations.length <= 8 }}">
+            <div class="memberList">
+              <template repeat="{{ association in instance.associations }}">
+                <div class="memberItem">
+                  <div class="memberValue">
+                    [<any-service-ref ref="{{ association['key'] }}"></any-service-ref>]
+                  </div>
+                  <div class="memberValue">
+                    <any-service-ref ref="{{ association['value'] }}"></any-service-ref>
+                  </div>
+                </div>
+              </template>
+            </div>
+          </curly-block><br><br>
+        </template>
+
       </div>
 
     </template>
     <view-footer></view-footer>
   </template>
 </polymer-element>
 
 <script type="application/dart" src="instance_view.dart"></script>