diff --git a/packages/treemap/stories/treemap.stories.js b/packages/treemap/stories/treemap.stories.js
index 9948b83f4e..8b5d8bbf85 100644
--- a/packages/treemap/stories/treemap.stories.js
+++ b/packages/treemap/stories/treemap.stories.js
@@ -6,9 +6,10 @@ import { TreeMap } from '../src'
 const commonProperties = {
     width: 900,
     height: 400,
-    root: generateLibTree(),
+    data: generateLibTree(),
     identity: 'name',
     value: 'loc',
+    valueFormat: '.02s',
     label: 'name',
     labelSkipRadius: 16,
 }
@@ -16,9 +17,9 @@ const commonProperties = {
 storiesOf('TreeMap', module).add('custom tooltip', () => (
     <TreeMap
         {...commonProperties}
-        tooltip={({ id, value, color }) => (
-            <strong style={{ color }}>
-                {id}: {value}
+        tooltip={({ node }) => (
+            <strong style={{ color: node.color }}>
+                {node.pathComponents.join(' / ')}: {node.formattedValue}
             </strong>
         )}
         theme={{
diff --git a/packages/treemap/stories/treemapHtml.stories.js b/packages/treemap/stories/treemapHtml.stories.js
index fb3e525a4b..14675e76ff 100644
--- a/packages/treemap/stories/treemapHtml.stories.js
+++ b/packages/treemap/stories/treemapHtml.stories.js
@@ -6,9 +6,10 @@ import { TreeMapHtml } from '../src'
 const commonProperties = {
     width: 900,
     height: 400,
-    root: generateLibTree(),
+    data: generateLibTree(),
     identity: 'name',
     value: 'loc',
+    valueFormat: '.02s',
     label: 'name',
     labelSkipRadius: 16,
 }
@@ -16,9 +17,9 @@ const commonProperties = {
 storiesOf('TreeMapHtml', module).add('custom tooltip', () => (
     <TreeMapHtml
         {...commonProperties}
-        tooltip={({ id, value, color }) => (
-            <strong style={{ color }}>
-                {id}: {value}
+        tooltip={({ node }) => (
+            <strong style={{ color: node.color }}>
+                {node.pathComponents.join(' / ')}: {node.formattedValue}
             </strong>
         )}
         theme={{