Marketing Data Bubble Chart

100%

Marketing Data Bubble Chart

✓ Published0🌍 Public

Last edited Jul 23, 2023

Created on Jul 23, 2023

This D3.js v7 bubble chart visualizes marketing campaign performance by plotting clicks on the x-axis and conversions on the y-axis, with each circle’s radius scaled to its budget. The SVG output uses `d3.scaleLinear` for axes, `d3.scaleOrdinal` with `d3.schemeCategory10` for categorical coloring, and a static legend listing each campaign. The chart renders a hardcoded array of ten campaigns, encoding three numeric variables through position and area.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Bubble Chart

A bubble chart visualizes the relationship between impressions and clicks for various websites, with each black circle representing a site. The data, sourced from a CSV file, is plotted using D3 v5's `scaleLinear` for both axes, with `axisBottom` and `axisLeft` providing labeled tick marks and gridlines. The chart is rendered as an SVG, with circles positioned via `cx` and `cy` attributes, and a title displayed. The visualization focuses on raw counts rather than the derived CTR metric.

Aases1996

74% match

Loading thumbnail…

act6-question9

A bubble chart visualizes advertising data, showing TV and Radio budgets on the x- and y-axes while the area of each circle encodes Sales figures. The visualization employs D3 v7 with `d3.scaleLinear` for axes, `d3.scaleSqrt` for bubble radius, `d3.scaleSequential` with `d3.interpolateBlues` for color encoding, and `d3.axisBottom`/`d3.axisLeft`. Interactive tooltips appear on mouseover, and data loads from a CSV via `d3.csv`. Rendered as SVG with opacity and black stroke styling.

RRayabarapu Nikhitha

73% match

Loading thumbnail…

activity6_question4

This bubble chart visualizes the relationship between marketing spend, revenue, and employee count for ten smartphone brands using a scatter plot with bubble size encoding employee numbers. The D3.js v7 implementation uses `d3.scaleLinear` for axes, `d3.scaleSqrt` for bubble radius, and `d3.scaleOrdinal` with the `d3.schemeSet3` color palette for brand differentiation. Interactive tooltips appear on hover, showing detailed metrics for each brand, while a legend identifies colors. Data is loaded from a CSV file using `d3.csv`.

Sshreshikaveerannagari@gmail.com

73% match

Loading thumbnail…

Bubble Chart

This bubble chart visualizes website traffic data from a CSV file, mapping impression counts to bubble size and click rates to vertical positioning, with color indicating content categories. The visualization uses D3 v5’s `csv` method to load the dataset and renders bubbles as SVG circles within a fixed 960×500 viewport. The code imports `select` and `csv` from D3, though the current implementation only logs the parsed data to the console, leaving the chart rendering incomplete. The page structure includes an SVG element styled with CSS, with the final visualization intended to use D3’s data binding and scaling methods.

Aases1996

71% match

Loading thumbnail…

Bubble Chart with D3.js

This example presents a bubble chart that visualizes product data from a CSV file, mapping Revenue to bubble radius and Profit to a secondary size influence, with colors assigned by category index. It uses D3.js v5 with an SVG rendering approach, reading data via `d3.csv()`, scaling values with `d3.scaleLinear()` and `d3.scaleOrdinal()`, and randomly positioning bubbles within the chart area. Each bubble includes a text label and a tooltip via appended `title` elements, while axis names for Revenue and Profit are added manually.

NNukaShravanKumar

70% match

Loading thumbnail…

Bubble Chart with D3.js

This example shows a bubble chart that visualizes product performance using Revenue to size each circle and Profit to influence color, with bubbles randomly positioned across the SVG canvas. Built with D3.js v5 and React, it loads data from a CSV file using `d3.csv` and renders circles and labels through SVG selections. The code uses `d3.scaleLinear` for mapping Revenue and Profit to radii, `d3.scaleOrdinal` with `d3.schemeCategory10` for colors, and adds tooltips via SVG `title` elements. Axes labels for Revenue and Profit are manually positioned as text elements.

Hharsha

70% match

Loading thumbnail…

Q4

This bubble chart uses D3 v7 to visualize sales data from a CSV file, plotting each product’s Revenue on the x-axis and Units Sold on the y-axis. Each circle is sized at a fixed radius and colored with `d3.scaleOrdinal` and `d3.schemeCategory10`. Hovering reveals a tooltip with product details, implemented via mouseover and mouseout events. The SVG is rendered with `d3.select` and `d3.append`, and axes are generated using `d3.axisBottom` and `d3.axisLeft`. The data is loaded with `d3.csv`.

Ssindhuja27b@gmail.com

70% match

Loading thumbnail…

activity 6_task4_Q9

This interactive bubble chart compares products by price on the x-axis and sales volume on the y-axis, with bubble size encoding each product’s rating. Built with D3.js v7, it renders as SVG and uses `d3.scaleLinear` for axes, `d3.scaleSqrt` for bubble radii, and `d3.scaleOrdinal` with `d3.schemeCategory10` to color-code product categories. Hovering a bubble triggers a tooltip showing detailed product attributes, while a legend identifies each category. Data is loaded from a local CSV file.

Cchandrikachowdary867@gmail.com

70% match