#TreeMap
#Product Sales TreeMap
A tree map showing sales distribution across product categories, sub-categories, and products.
import { VSeedRender } from '@components'
export default () => {
const vseedConfig = {
chartType: 'treeMap',
dataset: [
{
category: 'Electronics',
subCategory: 'Computers',
product: 'Laptop',
sales: 5000,
},
{
category: 'Electronics',
subCategory: 'Computers',
product: 'Tablet',
sales: 3000,
},
{
category: 'Electronics',
subCategory: 'Computers',
product: 'Desktop',
sales: 4000,
},
{
category: 'Electronics',
subCategory: 'Phones',
product: 'Smartphone',
sales: 8000,
},
{
category: 'Electronics',
subCategory: 'Phones',
product: 'Landline',
sales: 1000,
},
{
category: 'Furniture',
subCategory: 'Seating',
product: 'Office Chair',
sales: 2000,
},
{
category: 'Furniture',
subCategory: 'Seating',
product: 'Sofa',
sales: 3500,
},
{
category: 'Furniture',
subCategory: 'Tables',
product: 'Desk',
sales: 1500,
},
{
category: 'Furniture',
subCategory: 'Tables',
product: 'Coffee Table',
sales: 1200,
},
{
category: 'Office Supplies',
subCategory: 'Paper',
product: 'Printer Paper',
sales: 800,
},
{
category: 'Office Supplies',
subCategory: 'Paper',
product: 'Notebook',
sales: 500,
},
{
category: 'Office Supplies',
subCategory: 'Stationery',
product: 'Pen',
sales: 300,
},
{
category: 'Office Supplies',
subCategory: 'Stationery',
product: 'Stapler',
sales: 200,
},
],
dimensions: [
{
id: 'category',
alias: 'Category',
},
{
id: 'subCategory',
alias: 'SubCategory',
},
{
id: 'product',
alias: 'Product',
},
],
measures: [
{
id: 'sales',
alias: 'Sales',
},
],
}
return <VSeedRender vseed={vseedConfig} />
}#Measure Combination
Displays the distribution of sales and profit across categories like Food & Beverage and Personal Care, using nested rectangles to show hierarchies and measure relationships.
import { VSeedRender } from '@components'
export default () => {
const vseedConfig = {
chartType: 'treeMap',
dataset: [
{
category: 'Food & Beverage',
subCategory: 'Beverages',
product: 'Mountain Spring Water',
sales: 12000,
profit: 1800,
},
{
category: 'Food & Beverage',
subCategory: 'Beverages',
product: 'Fresh Orange Juice',
sales: 8500,
profit: 1400,
},
{
category: 'Food & Beverage',
subCategory: 'Beverages',
product: 'Oolong Tea',
sales: 6200,
profit: 950,
},
{
category: 'Food & Beverage',
subCategory: 'Snacks',
product: 'Crispy Potato Chips (Tomato)',
sales: 9500,
profit: 1600,
},
{
category: 'Food & Beverage',
subCategory: 'Snacks',
product: 'Mixed Nuts',
sales: 7800,
profit: 2100,
},
{
category: 'Personal Care & Cleaning',
subCategory: 'Personal Care',
product: 'Silk Smooth Shampoo',
sales: 6800,
profit: 1100,
},
{
category: 'Personal Care & Cleaning',
subCategory: 'Personal Care',
product: 'Amino Acid Cleanser',
sales: 5200,
profit: 980,
},
{
category: 'Personal Care & Cleaning',
subCategory: 'Home Cleaning',
product: 'Multi-effect Laundry Detergent',
sales: 7200,
profit: 1050,
},
{
category: 'Personal Care & Cleaning',
subCategory: 'Home Cleaning',
product: 'Kitchen Grease Spray',
sales: 4300,
profit: 720,
},
{
category: 'Digital Appliances',
subCategory: 'Smart Wearables',
product: 'Smart Watch S9',
sales: 15000,
profit: 3200,
},
{
category: 'Digital Appliances',
subCategory: 'Smart Wearables',
product: 'Sports Bracelet Pro',
sales: 6500,
profit: 1400,
},
{
category: 'Digital Appliances',
subCategory: 'Small Appliances',
product: 'Desktop Fan Heater',
sales: 4800,
profit: 880,
},
{
category: 'Digital Appliances',
subCategory: 'Small Appliances',
product: 'Portable Coffee Machine',
sales: 11000,
profit: 2600,
},
{
category: 'Digital Appliances',
subCategory: 'Small Appliances',
product: 'Car Air Purifier',
sales: 7600,
profit: 1750,
},
{
category: 'Apparel & Shoes',
subCategory: "Men's Clothing",
product: 'Business Jacket',
sales: 8800,
profit: 2400,
},
{
category: 'Apparel & Shoes',
subCategory: "Men's Clothing",
product: 'Basic T-shirt (3-pack)',
sales: 5600,
profit: 1500,
},
{
category: 'Apparel & Shoes',
subCategory: "Women's Clothing",
product: 'Floral Dress',
sales: 9200,
profit: 2800,
},
{
category: 'Apparel & Shoes',
subCategory: "Women's Clothing",
product: 'Cashmere Scarf',
sales: 4100,
profit: 1200,
},
{
category: 'Apparel & Shoes',
subCategory: 'Shoes & Boots',
product: 'Cushioning Running Shoes',
sales: 13500,
profit: 3600,
},
],
dimensions: [
{
id: 'category',
alias: 'Category',
encoding: 'hierarchy',
},
{
id: 'subCategory',
alias: 'Sub-Category',
encoding: 'hierarchy',
},
{
id: 'product',
alias: 'Product',
encoding: 'hierarchy',
},
{
id: '__MeaId__',
alias: 'Measure Name',
encoding: 'hierarchy',
},
],
measures: [
{
id: 'sales',
alias: 'Sales (CNY)',
encoding: 'size',
parentId: 'a',
},
{
id: 'profit',
alias: 'Profit',
encoding: 'size',
parentId: 'b',
},
],
}
return <VSeedRender vseed={vseedConfig} />
}#Global Retail Revenue Landscape With Encoding Visualize
Sales and profit distribution of a global retail chain across 4 regions (Asia Pacific, North America, Europe, Latin America), 3 channels (Online, Retail Store, Wholesale), and 3 product categories (Personal Care, Home Appliance, Food & Beverage), enabling multi-dimensional drill-down analysis via TreeMap.
import { VSeedRender } from '@components'
export default () => {
const vseedConfig = {
chartType: 'treeMap',
dimensions: [
{
id: 'channel',
alias: 'Channel',
encoding: 'column',
},
{
id: '__MeaId__',
encoding: 'hierarchy',
},
{
id: 'region',
alias: 'Region',
encoding: 'hierarchy',
},
{
id: 'category',
alias: 'Category',
encoding: 'hierarchy',
},
{
id: 'product',
alias: 'Product',
encoding: 'hierarchy',
},
],
measures: [
{
id: 'sales',
alias: 'Sales',
encoding: 'size',
},
{
id: 'profit',
alias: 'Profit',
encoding: 'size',
},
],
dataset: [
{
region: 'Asia Pacific',
channel: 'Online',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 12400,
profit: 3720,
},
{
region: 'Asia Pacific',
channel: 'Online',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 9800,
profit: 2450,
},
{
region: 'Asia Pacific',
channel: 'Online',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 18500,
profit: 5550,
},
{
region: 'Asia Pacific',
channel: 'Online',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 14200,
profit: 3550,
},
{
region: 'Asia Pacific',
channel: 'Online',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 7600,
profit: 3040,
},
{
region: 'Asia Pacific',
channel: 'Online',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 5400,
profit: 1890,
},
{
region: 'Asia Pacific',
channel: 'Retail Store',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 8600,
profit: 2150,
},
{
region: 'Asia Pacific',
channel: 'Retail Store',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 7200,
profit: 1800,
},
{
region: 'Asia Pacific',
channel: 'Retail Store',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 11300,
profit: 2825,
},
{
region: 'Asia Pacific',
channel: 'Retail Store',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 9700,
profit: 2425,
},
{
region: 'Asia Pacific',
channel: 'Retail Store',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 6100,
profit: 2440,
},
{
region: 'Asia Pacific',
channel: 'Retail Store',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 4300,
profit: 1505,
},
{
region: 'Asia Pacific',
channel: 'Wholesale',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 15800,
profit: 3160,
},
{
region: 'Asia Pacific',
channel: 'Wholesale',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 12600,
profit: 2520,
},
{
region: 'Asia Pacific',
channel: 'Wholesale',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 22400,
profit: 4480,
},
{
region: 'Asia Pacific',
channel: 'Wholesale',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 17500,
profit: 3500,
},
{
region: 'Asia Pacific',
channel: 'Wholesale',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 9800,
profit: 2940,
},
{
region: 'Asia Pacific',
channel: 'Wholesale',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 7200,
profit: 2160,
},
{
region: 'North America',
channel: 'Online',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 14200,
profit: 4260,
},
{
region: 'North America',
channel: 'Online',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 11500,
profit: 2875,
},
{
region: 'North America',
channel: 'Online',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 21300,
profit: 6390,
},
{
region: 'North America',
channel: 'Online',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 16800,
profit: 4200,
},
{
region: 'North America',
channel: 'Online',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 9200,
profit: 3680,
},
{
region: 'North America',
channel: 'Online',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 6800,
profit: 2380,
},
{
region: 'North America',
channel: 'Retail Store',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 10800,
profit: 2700,
},
{
region: 'North America',
channel: 'Retail Store',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 8900,
profit: 2225,
},
{
region: 'North America',
channel: 'Retail Store',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 14600,
profit: 3650,
},
{
region: 'North America',
channel: 'Retail Store',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 12100,
profit: 3025,
},
{
region: 'North America',
channel: 'Retail Store',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 7400,
profit: 2960,
},
{
region: 'North America',
channel: 'Retail Store',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 5100,
profit: 1785,
},
{
region: 'North America',
channel: 'Wholesale',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 18200,
profit: 3640,
},
{
region: 'North America',
channel: 'Wholesale',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 14800,
profit: 2960,
},
{
region: 'North America',
channel: 'Wholesale',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 26500,
profit: 5300,
},
{
region: 'North America',
channel: 'Wholesale',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 20300,
profit: 4060,
},
{
region: 'North America',
channel: 'Wholesale',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 11600,
profit: 3480,
},
{
region: 'North America',
channel: 'Wholesale',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 8500,
profit: 2550,
},
{
region: 'Europe',
channel: 'Online',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 10600,
profit: 3180,
},
{
region: 'Europe',
channel: 'Online',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 8400,
profit: 2100,
},
{
region: 'Europe',
channel: 'Online',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 15900,
profit: 4770,
},
{
region: 'Europe',
channel: 'Online',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 12500,
profit: 3125,
},
{
region: 'Europe',
channel: 'Online',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 8800,
profit: 3520,
},
{
region: 'Europe',
channel: 'Online',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 4900,
profit: 1715,
},
{
region: 'Europe',
channel: 'Retail Store',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 7800,
profit: 1950,
},
{
region: 'Europe',
channel: 'Retail Store',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 6500,
profit: 1625,
},
{
region: 'Europe',
channel: 'Retail Store',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 10200,
profit: 2550,
},
{
region: 'Europe',
channel: 'Retail Store',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 8800,
profit: 2200,
},
{
region: 'Europe',
channel: 'Retail Store',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 7100,
profit: 2840,
},
{
region: 'Europe',
channel: 'Retail Store',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 3800,
profit: 1330,
},
{
region: 'Europe',
channel: 'Wholesale',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 13400,
profit: 2680,
},
{
region: 'Europe',
channel: 'Wholesale',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 10900,
profit: 2180,
},
{
region: 'Europe',
channel: 'Wholesale',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 19800,
profit: 3960,
},
{
region: 'Europe',
channel: 'Wholesale',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 15200,
profit: 3040,
},
{
region: 'Europe',
channel: 'Wholesale',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 10500,
profit: 3150,
},
{
region: 'Europe',
channel: 'Wholesale',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 6300,
profit: 1890,
},
{
region: 'Latin America',
channel: 'Online',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 6200,
profit: 1860,
},
{
region: 'Latin America',
channel: 'Online',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 4800,
profit: 1200,
},
{
region: 'Latin America',
channel: 'Online',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 9400,
profit: 2820,
},
{
region: 'Latin America',
channel: 'Online',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 7100,
profit: 1775,
},
{
region: 'Latin America',
channel: 'Online',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 8500,
profit: 3400,
},
{
region: 'Latin America',
channel: 'Online',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 3600,
profit: 1260,
},
{
region: 'Latin America',
channel: 'Retail Store',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 4500,
profit: 1125,
},
{
region: 'Latin America',
channel: 'Retail Store',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 3700,
profit: 925,
},
{
region: 'Latin America',
channel: 'Retail Store',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 6800,
profit: 1700,
},
{
region: 'Latin America',
channel: 'Retail Store',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 5200,
profit: 1300,
},
{
region: 'Latin America',
channel: 'Retail Store',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 6900,
profit: 2760,
},
{
region: 'Latin America',
channel: 'Retail Store',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 2800,
profit: 980,
},
{
region: 'Latin America',
channel: 'Wholesale',
category: 'Personal Care',
product: 'Electric Toothbrush',
sales: 8600,
profit: 1720,
},
{
region: 'Latin America',
channel: 'Wholesale',
category: 'Personal Care',
product: 'Hair Dryer',
sales: 6900,
profit: 1380,
},
{
region: 'Latin America',
channel: 'Wholesale',
category: 'Home Appliance',
product: 'Robot Vacuum',
sales: 12500,
profit: 2500,
},
{
region: 'Latin America',
channel: 'Wholesale',
category: 'Home Appliance',
product: 'Air Purifier',
sales: 9600,
profit: 1920,
},
{
region: 'Latin America',
channel: 'Wholesale',
category: 'Food & Beverage',
product: 'Organic Coffee',
sales: 10200,
profit: 3060,
},
{
region: 'Latin America',
channel: 'Wholesale',
category: 'Food & Beverage',
product: 'Protein Bar',
sales: 5100,
profit: 1530,
},
],
}
return <VSeedRender vseed={vseedConfig} />
}