Skip to main content
100%

7.24.18 Top of Funnel for Board

✓ Published0🌍 Public
WWeikerWT
Last edited Sep 17, 2018
Created on Jul 24, 2018

This interactive treemap visualizes marketing funnel metrics from a CSV file, showing conversion values across seven channels (Twitter, Website Visits, Form Generation, Paid Search, Cold Email, Feedfall, Blog, and Opps) over three time periods. Users toggle between a standard treemap view and a cluster layout via a checkbox. The visualization uses D3 v4 with SVG rendering, animating transitions between the two views. Each rectangle’s size encodes its metric value, with labels and values displayed inside the nodes. Hovering over a rectangle triggers a dark tooltip showing the exact value for that channel and period, implemented via d3-tip. The "Top of Funnel" title and the included CSV data suggest this is a marketing-funnel dashboard tracking channel performance across three sequential time periods. The block is built with Blockbuilder and released under the MIT license.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

Pipeline Q4 2017

This visualization displays a sales pipeline for Q4 2017 as an animated radial partition (sunburst) diagram. The hierarchical dataset, loaded from flare.json, tracks seven major accounts—including Microsoft, McKinsey, FedEx, Johnson & Johnson, and others—through successive sales stages from Qualified Lead to Closed Won, with some branches ending in "LOST". Each arc segment represents a stage in the sales process, with its angular width and radial depth proportional to the number of deals at that stage. The visualization uses a color-coded category scale to distinguish parent and child nodes, and the entire diagram is rendered as an SVG with a smooth, animated transition when the data loads. The sunburst layout makes it easy to compare how far each account has progressed through the pipeline and where deals have stalled or been lost. Built with D3 v3 and Blockbuilder.org, this example is licensed under MIT and demonstrates a clean, animated partition layout for hierarchical pipeline data.Pipeline Q4 2017 is an animated, SVG-based D3.js partition (sunburst) diagram that visualizes a sales pipeline across multiple enterprise accounts. The hierarchical dataset, loaded from a JSON file, organizes opportunities under client names such as Microsoft, McKinsey, FedEx, and Johnson & Johnson. Each branch represents sequential sales stages—Qualified Lead, Opportunity Created, Solution Proposed, POC, Legal/IT, and Closed-Won—with node sizes reflecting counts of opportunities. The visualization uses a radial layout with a square-root scale for area encoding and a categorical color scheme. Paths are drawn as arcs with white strokes, and the animation highlights the structural flow of the pipeline. Built with D3 v3 and rendered as SVG. This example is part of a blockbuilder.org project and is licensed under MIT.Pipeline Q4 2017 is an interactive data visualization built with D3.js that presents a sales pipeline as a radial partition (sunburst) diagram. The visualization maps hierarchical sales data from flare.json, showing the progression of opportunities through stages—from Qualified Lead through Opportunity Created, Solution Proposed, POC, and Legal/IT to Closed-Won—for several major accounts including Microsoft, McKinsey, FedEx, Johnson & Johnson, and others. Using an animated SVG rendering with a categorical color scheme, the diagram assigns arc sizes based on the data's numeric values, enabling quick comparison of deal progress across accounts. The layout emphasizes the funnel-like nature of the sales process, with each ring representing a stage in the pipeline. The interactive animation (via D3 v3) reveals the hierarchical structure and relative magnitudes of opportunities at each stage. This visualization was created with Blockbuilder.org and is available under the MIT license. Title: Pipeline Q4 2017 This D3.js visualization depicts a sales pipeline using an interactive radial partition layout (sunburst). Data is sourced from a JSON file representing a hierarchical sales funnel across multiple accounts, including Microsoft, McKinsey, FedEx, Johnson & Johnson, and others. The hierarchy tracks stages from "Qualified Lead" through "Opportunity Created," "Solution Proposed," "POC," and "Legal/IT," culminating in "Closed - Won" or "LOST" outcomes. The visualization uses a color-coded, animated sunburst diagram rendered with SVG to represent the proportional sizes of opportunities at each stage. This example was built with D3 v3 and blockbuilder.org, and is licensed under MIT.

WWeikerWT
66% match
Loading thumbnail…

Pipeline Q1 2018

This interactive radial partition chart visualizes a sales pipeline for Q1 2018, with data nested by company and deal stage. The hierarchy flows from account names like Microsoft, Cummins, and Wendy's down through stages such as Qualified Lead, Opportunity Created, Solution Proposed, POC, Legal/IT, and Closed - Won. Each arc's size encodes the number of deals at that stage, while colors distinguish the parent company or stage. Clicking an arc smoothly animates a zoom into that segment, re-scaling the layout to focus on the selected portion of the pipeline. Rendered as an SVG using D3 v3’s partition layout, the visualization uses a sunburst-style radial layout with white strokes separating arcs. The accompanying flare.json defines the hierarchical sales pipeline data, and the color scale uses d3.scale.category20c to differentiate categories. The animation on click is implemented with a transition and tween on the scale, providing an interactive way to explore the sales funnel. The code is based on the classic Zoomable Sunburst example and is available under the MIT license.Pipeline Q1 2018 is an interactive radial partition (sunburst) visualization built with D3 v3 and rendered as SVG with animated transitions. The chart displays a sales pipeline organized as a hierarchical tree: top-level nodes are company names (e.g., Microsoft, Cummins, Wendy's), and child nodes represent progressive deal stages—Qualified Lead, Opportunity Created, Solution Proposed, POC, Legal/IT, and Closed - Won. Node sizes encode the number of deals at each stage, and the color scale groups the arcs by parent company. The visualization uses an animated zoom interaction: clicking any arc smoothly transitions and rescales the chart to focus on that node, allowing users to drill into the pipeline stages for a particular account. This compact example highlights a typical sales-funnel workflow and is built with D3 v3 and the partition layout, rendered as an interactive sunburst with SVG. It is available under the MIT license.Pipeline Q1 2018 is a D3.js partition chart (sunburst) that visualizes a sales pipeline by account and stage. Built with D3 v3, it renders an interactive, animated SVG where each arc represents a deal stage—from Qualified Lead and Opportunity Created through Solution Proposed, POC, and Legal/IT, to Closed Won or Closed Lost. The size of each arc encodes the number of deals, and clicking any arc smoothly zooms to focus on that segment. Color encodes the top-level account names, making it easy to compare progress across Microsoft, Cummins, Wendy's, Reliance, T-Mobile, McKinsey, AutoNation, Fidelity, and others. The hierarchical partition layout and zoom transition provide a clear view of each account’s pipeline progression in Q1 2018. Data is from a gist by WeikerWT, built with D3 v3, rendered with SVG and animation, and released under the MIT license.# Pipeline Q1 2018 This interactive **sunburst partition diagram** visualizes a sales pipeline for Q1 2018, showing the progression of opportunities through six stages—from Qualified Lead to Closed Won—across major accounts including Microsoft, Cummins, Wendy's, Reliance Industries, T-Mobile, McKinsey, AutoNation, and Fidelity. Built with D3.js, the visualization uses a radial space-filling layout where each ring represents a stage in the sales funnel. The hierarchy maps accounts to their deals, with each node colored by its parent category using a categorical color scale. White strokes separate segments. The size of each arc corresponds to the deal's assigned value, with values of 0 or 1 indicating the stage reached. Users can click on any arc to trigger a smooth animated zoom into that branch, allowing exploration of the pipeline stages from account through Qualified Lead, Opportunity Created, Solution Proposed, POC, Legal/IT, and finally Closed - Won or Close - LOST. The visualization provides an at-a-glance view of deal progression across accounts like Microsoft, Cummins, Wendy's, and Reliance Industries. Rendered as an interactive zoomable sunburst with SVG and animation.Pipeline Q1 2018 is an interactive sunburst visualization that maps a quarterly sales pipeline across major accounts. Built with D3 v3 and rendered as animated SVG, it uses a hierarchical partition layout where the root represents the overall pipeline, branching into accounts (Microsoft, Cummins, Wendy's, etc.) and then into sales stages such as Qualified Lead, Opportunity Created, Solution Proposed, POC, Legal/IT, and Closed - Won. The visualization encodes the sales funnel as nested arcs: each ring corresponds to a stage in the pipeline, and each arc segment represents a specific account's progression. A color palette distinguishes parent categories, while white strokes separate the segments. Clicking any arc triggers a smooth zoom transition, expanding that portion of the hierarchy to fill the visualization and allowing users to explore a particular account or stage in detail. The data is sourced from a Gist and built with D3 v3 using an SVG-based partition layout with animations. This interactive sunburst provides an at-a-glance view of the Q1 2018 sales pipeline, highlighting the varying stage counts across accounts and enabling quick identification of bottlenecks or lost deals.# Pipeline Q1 2018 This interactive sunburst chart visualizes a sales pipeline organized by account and stage. The hierarchical data flows from top-level client names (Microsoft, Cummins, Wendy's, etc.) through progressive sales stages: Qualified Lead, Opportunity Created, Solution Proposed, POC, Legal/IT, and ultimately Closed - Won or Closed - Lost. Built with D3.js, the visualization uses a radial partition layout where each ring segment represents a stage in the sales process, and arc size reflects the number of deals at that stage. Color encoding uses a categorical palette keyed by account name to allow quick comparison across organizations. Animated transitions zoom into a segment when clicked, providing interactive exploration of each account's pipeline progression. The visualization highlights one interesting pattern: most accounts show a value of 1 at Qualified Lead, but only Reliance Industries has progressed to the Opportunity Created stage, suggesting different stages of engagement across accounts. The example demonstrates the classic zoomable sunburst/partition layout with SVG rendering and smooth animated transitions, using D3 v3. The source data is a flare.json-style hierarchical structure, and the project is built with Blockbuilder.org under an MIT license. The visualization is based on a partition layout and arc generator, with a color scale mapping company names to categorical colors. The white stroke separates the segments. Animated zooming on click reveals deeper stages of the sales pipeline for each account. Interactions: click a segment to zoom in; click the center to zoom out. </script> ``` Please write it. Format: ## Summary [one paragraph] ## Design [one paragraph] ## Data mapping [one paragraph]## Pipeline Q1 2018 **Summary** — This sunburst/partition diagram visualizes a sales pipeline organized by account, showing the hierarchical progression of deals through stages from "Qualified Lead" to "Closed - Won" (or "Close - LOST"). It is built with D3.js v3 and rendered as an interactive SVG with click-to-zoom animations, allowing users to explore the status of opportunities across multiple named accounts (Microsoft, Cummins, Wendy's, etc.). The dataset is small, and the `size` values indicate which stage each account has reached. **Data mapping** — The hierarchy is encoded spatially with a radial partition layout. The `size` field of each leaf determines the area of its corresponding arc, while the depth of a node controls its angular extent. Color is assigned per company or stage using `d3.scale.category20c`, making it easy to distinguish accounts and phases. Clicking an arc zooms into that node via a smooth tween animation, revealing the next level of the sales pipeline. **Design choices** — The visualization uses a zoomable sunburst/partition layout, with white strokes separating segments. Tooltips show node names and formatted values, while the animated zoom on click allows interactive exploration of the hierarchy from the top-level account names down to individual pipeline stages. The category20c color palette provides a categorical color scheme to differentiate top-level companies and their child stages. This is a static snapshot of the Q1 2018 pipeline data. **Key visual encodings:** Angle and arc size encode the numeric size value from the hierarchical data; color encodes the parent company or stage name; and the radial layout makes the hierarchy easy to explore by clicking to zoom into any node. **Context:** This is a D3.js partition diagram (a type of sunburst chart) showing a sales pipeline hierarchy. Each ring segment represents a stage in the sales process (Qualified Lead, Opportunity Created, Solution Proposed, POC, Legal/IT, Closed-Won) grouped by company. The animation on click lets you zoom into a stage, making it easy to follow specific opportunities through the pipeline. **Caption:** A sunburst diagram of a sales pipeline for Q1 2018, showing opportunities grouped by company and progressing through stages from qualified lead to closed-won. Interactive click-to-zoom lets users explore each branch in detail.Pipeline Q1 2018 is a zoomable sunburst visualization of a sales pipeline, built with D3.js v3. It uses an SVG partition layout and animation to display hierarchical opportunity data, grouped by company (e.g., Microsoft, Cummins, Wendy's) and broken down by sales stages from Qualified Lead through Opportunity Created, Solution Proposed, POC, Legal/IT, to Closed – Won. Each arc’s size encodes a count (0 or 1) at that stage, and clicking an arc smoothly zooms to that node. Category20c coloring distinguishes parent branches. The visualization was authored by WeikerWT and is released under the MIT license.

WWeikerWT
64% match