Skip to main content
SimilarExport ZIP
100%

Churn data based on multi filters

✓ Published0🌍 Public
AArjun Rao
Last edited Nov 5, 2020
Created on Nov 3, 2020

This visualization explores customer churn data from Kaggle, showing the relationship between estimated salary and credit score. An interactive brush on a binned salary histogram filters the main scatter plot, while dropdown and radio menus let users select specific countries and genders. The visualization uses vega-lite-api with D3.js to fetch CSV data, and employs interactive selections (interval brushing and single-point binding) to link the two views and adjust point opacity based on selection state.

AI-generated description

A visualization constructed using the vega-lite-api.

The data shown here comes from the Kaggle, via Gist.

I took help from https://observablehq.com/@uwdata/interaction?collection=@uwdata/visualization-curriculum.

You can select a range of salaries on the top graph to view that in the below graph. I have binned the salaries into 50 bins.

Additionaly, you can select which gender you want to focus on and the country the customers are from.

MIT Licensed

Similar vizzes

Loading thumbnail…

Churn data based on multi filters

This visualization explores customer churn data from Kaggle, showing the relationship between estimated salary, credit score, and churn status through a bar chart and point plot. Users can brush a salary range on the top graph, which filters the scatter plot below, and use dropdown and radio menus to filter by geography and gender. Built with the vega-lite-api library, it uses `vl.selectInterval` for brushing, `vl.selectSingle` for menu-based filtering, and `vl.vconcat` to compose the linked views.

AArjun Rao
96% match
Loading thumbnail…

Dynamic binning( Not yet complete)

This interactive visualization explores customer churn data from Kaggle, focusing on the relationship between estimated salary and credit score. Users can brush a salary range on a small bar chart to filter the main scatter plot, and use menus to select a specific country and gender for comparison. The display dynamically re-bins the salary axis into five bins based on the brush selection, with opacity highlighting the relevant data points. Built with the vega-lite-api and D3, it combines multiple selection types—interval brushing, dropdown menus, and radio buttons—to create a linked-view analysis tool.

AArjun Rao
90% match
Loading thumbnail…

Churn data based on binning and choosing a range of salaries

A churn dataset from Kaggle is presented as an interactive visualization of credit scores versus estimated salaries, where the salary axis is binned into 50 discrete intervals. The upper plot acts as a salary-range brush: dragging a selection interval across it filters the points rendered in the lower scatterplot, which uses opacity to highlight the selected salary band against all other data. The visualization is built with the vega-lite-api, vega, and vega-lite JavaScript libraries, with data loaded via d3.csv from a Gist.

AArjun Rao
89% match
Loading thumbnail…

Churn or not

This interactive scatter plot displays the relationship between credit score, estimated salary, and other attributes for bank customers, with each point colored by churn status. Users can select different attributes for the X and Y axes via dropdown menus, and hovering over a color legend item fades non-matching data points to highlight a specific churn group. The visualization uses React and D3 v5, with scales created through d3.scaleLinear and d3.scaleOrdinal, and renders circles as SVG marks. Data is loaded from a CSV file of the Churn dataset.

AArjun Rao
85% match
Loading thumbnail…

Comparing salaries and churn with respect to gender

This interactive visualization compares salaries and churn by gender using a scatterplot linking gender to estimated salary, with color indicating churn status. A brushable bar chart filters salary ranges, while a second brushable axis filters age groups, dynamically updating point opacity and color. Built with vega-lite-api in d3.v5, the view includes a tooltip showing salary, credit score, age, geography, and churn. Data originates from a Kaggle churn modeling dataset, accessed via CSV through d3.csv.

AArjun Rao
84% match
Loading thumbnail…

Are you leaving because of your creditscore?

This scatterplot examines whether bank customers churn based on credit score and age. Each point represents a customer, colored by whether they exited the bank, with a tooltip revealing the customer ID. The visualization uses the Vega-Lite API with d3.v5 to load CSV data from a Kaggle churn-modelling dataset. The axes show age and credit score without zero baselines, and the chart is configured with custom styling for dark labels and light gray tick marks.

AArjun Rao
77% match
Loading thumbnail…

Churn of a company CSV Data

This example loads a CSV dataset on employee churn from a Kaggle-hosted file and uses D3 v5’s `d3.csv` to parse it. The visualization displays only summary statistics: the file size in kilobytes, the number of data rows, and the number of columns, rendered as large text in a `<pre>` element. The code also demonstrates an alternative approach using the Fetch API with `async/await` and `d3.csvParse`, though that path remains commented out. The interface is minimal, showing no charts or plots, but serves as a concise data-loading and formatting check.

AArjun Rao
71% match
Loading thumbnail…

Scatter Plot - Credit Card Utilization Patterns by Attrition Status

This interactive D3.js scatter plot visualizes credit card utilization patterns from the Bank Customers Dataset, plotting customer age against total transaction amount. Each circle represents an individual, colored by attrition status—blue for active customers and gray for those who churned. Users can dynamically change the x- and y-axis variables via dropdown menus powered by a custom `menu` module, with smooth transitions updating the axes and points. The visualization uses `scaleLinear`, `scaleOrdinal`, and `axisBottom`/`axisLeft` from D3, rendered as an SVG with hover interactions that highlight individual points and a legend filtering by attrition status.

RRaul Gamez
70% match