Portugal, Housing Loan Customers, DashBoard

100%

Portugal, Housing Loan Customers, DashBoard

✓ Published0🌍 Public

Last edited Apr 15, 2016

Created on Feb 25, 2016

This dashboard visualizes housing loan customers in Portugal, linking a histogram of state frequencies to a pie chart and legend of loan outcomes (yes, no, unknown). Hovering over a histogram bar filters the pie chart and legend to that state, while the pie chart updates the histogram bars proportionally. Built with D3 v3 using SVG, it relies on ordinal and linear scales, `d3.svg.axis`, and transition methods to animate updates. Data is drawn from a Gist by MatteoTomassetti, forked from NPashaP’s block.

AI-generated description

A simple example of creating a dashboard. This example was created for the paper Interactive HTML Reporting Using D3 at the MWSUG2014 conference.

Hovering over a bar in histogram will modify the pie chart and legend.
Hovering over pie slice will update the histogram.

forked from <a href='http://bl.ocks.org/NPashaP/'>NPashaP</a>'s block: <a href='http://bl.ocks.org/NPashaP/96447623ef4d342ee09b'>DashBoard</a>

forked from <a href='http://bl.ocks.org/MatteoTomassetti/'>MatteoTomassetti</a>'s block: <a href='http://bl.ocks.org/MatteoTomassetti/4d79d0cdb41a16903b7e'>DashBoard</a>

Similar vizzes

Loading thumbnail…

Portugal banking

A horizontal bar chart displays the number of people across Portugal's banking regions, with labels such as Lisboa and Norte shown on the y-axis. Bars animate from zero to their final width over two seconds, while text labels count up from zero to the correct values using a text tween. The visualization uses D3 v3 with SVG, including `d3.scale.linear`, `d3.scale.ordinal`, and `transition.tween` for smooth updates. Data comes from a local CSV file read via `d3.csv`.

MMatteoTomassetti

78% match

Loading thumbnail…

Portugal banking

A vertical bar chart displays the population of Portuguese regions, with each region listed along the y-axis and a horizontal bar showing its number of people. The chart loads data from a CSV file and animates both the bars and their labels over two seconds. Using d3.v3, the code employs a linear scale for bar widths, an ordinal scale for region positions, and `transition.attr` for width changes, while `transition.tween` with `d3.interpolate` animates the text labels. The rendering uses SVG elements with a light blue fill for the bars.

GGeorgeMcIntire

77% match

Loading thumbnail…

Portugal banking

A horizontal bar chart shows the population of Portuguese regions, sorted by region name, with blue bars animating from zero to their final lengths. The chart uses animated text tweens to count up to each region's population value during the transition. Built with D3.js v3, the visualization loads data from a CSV file and uses d3.transition with ease curves and d3.interpolate for the numeric text animation, while ordinal scales position the region labels.

GGeorgeMcIntire

76% match

Loading thumbnail…

DashBoard

This dashboard links a histogram, pie chart, and legend to enable interactive exploration of frequency data across states. Hovering over a histogram bar filters the pie chart and legend to show that state’s breakdown by age group, while hovering over a pie slice updates the histogram to display the distribution of that age group across all states. Built with D3 v3, it uses SVG for rendering and transitions for smooth updates, with mouseover and mouseout events driving the synchronized changes between the three visual components.

MMatteoTomassetti

71% match

Loading thumbnail…

Portugal banking

This example displays a horizontal bar chart comparing the accuracy scores of six machine learning algorithms, from Decision Tree (0.57) to Logistic Regression (0.98). The bars animate by growing from zero width, while their labels transition numerically from 0 to the final value. The chart uses d3.v3 with a linear scale for the x-axis and an ordinal scale for the y-axis, rendering as SVG. Text tweening is implemented via `d3.interpolate` within a `.tween` callback, with data loaded from a CSV file.

MMatteoTomassetti

71% match

Loading thumbnail…

DashBoard

The dashboard displays the distribution of frequencies across three categories—low, mid, and high—for each state, using a histogram and an interactive pie chart linked to it. Hovering over a histogram bar filters the pie chart and legend to show that state’s category breakdown, while hovering over a pie slice updates the histogram to reflect the selected category’s totals. Built with D3 v3, the visualization uses SVG for rendering and transitions for smooth updates, driven by the `histoGram` and `pieChart` functions. The data comes from a Gist, with the code styled via custom CSS for hover effects and axis formatting.

AAlainRo

71% match

Loading thumbnail…

DashBoard

This dashboard combines a bar chart and a pie chart to explore categorical frequency data. Hovering over a bar updates the pie chart and legend to show the breakdown for that category, while hovering over a pie slice updates the histogram with the corresponding frequencies. Built with D3 v3, it uses ordinal and linear scales, SVG rendering, and smooth transitions to animate changes. The data is structured with low, mid, and high frequency values for each state.

KKirun1

70% match

Loading thumbnail…

DashBoard

This dashboard example shows how linked views can be used for interactive data exploration. A bar chart of state frequencies and a pie chart with a legend are initially displayed together, and hovering over a bar in the histogram updates the pie chart and legend to show that state's breakdown by low, mid, and high segments. Conversely, hovering over a pie slice triggers a transition that updates the histogram to reflect the frequencies of that segment across the states. The code uses D3 v3 with an SVG rendering approach, relying on d3.scale.ordinal, d3.scale.linear, and transition methods to animate the changes.

KKirun1

68% match