Percentage of the population that suffered from schizophrenia in Central American countries over the years

100%

Percentage of the population that suffered from schizophrenia in Central American countries over the years

✓ Published0🌍 Public

Last edited Sep 21, 2020

Created on Sep 15, 2020

This visualization uses grouped bar charts to compare the percentage of the population suffering from schizophrenia in Costa Rica, Guatemala, Nicaragua, and Panama for the years 1995, 2005, and 2015. The vega-lite-api, built on Vega-Lite and Vega, renders the chart, with bar color encoding each country. Tooltips display the average schizophrenia percentage per country via a vega-tooltip handler. Data is loaded asynchronously from a CSV file using d3.csv and filtered to select the specified countries and years, with a custom config adjusting axis colors and font sizes.

AI-generated description

This visualization was constructed using the vega-lite-api.

The idea behind this visualization was to show the percentage of the population of Costa Rica, Guatemala, Nicaragua and Panama who has suffered from schizophrenia over the years.

The data used in this visualization can be found on Gist here: Mental Healths Disorders Dataset

MIT Licensed

Similar vizzes

Loading thumbnail…

Mental illneses in American countries throughout the years

This visualization uses a multi-line chart to show the percentage of the population affected by mental illnesses in Costa Rica, Colombia, and Brazil from 2000 onward. The graph highlights that overall levels remain stable, with slight recent declines in Brazil and Colombia. It is built with Vega-Lite’s API for chart specification, using D3 to load CSV data from a Gist and vega-tooltip for interactivity. The chart applies a custom color scale and filters data to post-2000 years.

FFelipe Mejías

79% match

Loading thumbnail…

People affected by mental diseases over the years in American Countries with Interactive Legends

This interactive line chart shows the percentage of the population affected by mental health disorders in four American countries—Costa Rica, Colombia, Honduras, and Ecuador—from 1990 to 2017. A dropdown menu lets users select among seven disorder types, while a color legend highlights individual country trends. Built with React and D3 v5, it uses `scaleTime`, `scaleLinear`, and `scaleOrdinal` to map data, with hover interactions on the legend fading non-selected countries. The visualization draws SVG paths using `d3.line` with `curveNatural`, rendering data from a CSV loaded via `d3.csv`.

FFelipe Mejías

75% match

Loading thumbnail…

DataViz Project - Second Visualization

This interactive bar chart compares unemployment rates and mental illness prevalence across the five most affected countries for a selected year. Users can switch between 1995, 2000, 2005, 2010, and 2015 via a React dropdown menu. The visualization uses React hooks, d3.scaleBand and d3.scaleLinear for axes, and d3.csv to load the mental health dataset from a GitHub gist. Hovering over the color legend highlights corresponding bars and fades others, with tooltips showing exact values.

FFelipe Mejías

69% match

Loading thumbnail…

People affected by mental diseases over the years in American Countries

This interactive visualization shows how the percentage of a population affected by various mental health disorders changes over time across American countries. Users can select a country and a mental disease from dropdown menus to filter the view. A single line chart displays the trend using SVG paths generated with d3.line and curveNatural. The React application uses D3 v5 scales (scaleTime, scaleLinear) for axes and data from a CSV file loaded via d3.csv.

FFelipe Mejías

69% match

Loading thumbnail…

Selecting a year on a line chart using React

A line chart displays mental health disorder rates in Costa Rica from 1990 to 2017, with a dropdown menu to switch between seven disorder categories. The chart uses React and D3 v5, rendering an SVG with a vertical black line that follows the mouse cursor to select a year. This selection is computed by inverting the x-scale from the mouse position, and the x-axis uses a time scale with yearly ticks. Data comes from a CSV file loaded via `d3.csv`.

FFelipe Mejías

68% match

Loading thumbnail…

Bar chart with D3.js

This interactive bar chart displays crime statistics across Costa Rican cantons, breaking down reported incidents by victim type and offense category. Built with D3.js v5, the visualization uses `d3.scaleBand` and `d3.scaleLinear` to position SVG rectangles, with data loaded from a CSV file via `d3.csv`. Hovering over a bar triggers `mouseenter` and `mouseleave` events that fade other bars, draw a dashed threshold line via `chart.append('line')`, and temporarily display percentage divergence labels for comparison.

Eest85

67% match

Loading thumbnail…

DataViz Project - Third Visualization - Mental Illness Choropleth Map with Linked Line Chart

A choropleth map shades countries by the percentage of their population with mental illness for a selected year, while a linked line chart below plots the same metric over time for every country. Moving the mouse horizontally across the chart updates the map to the corresponding year. The visualization uses React with D3 v5, including `geoNaturalEarth1` and `geoPath` for the map, `scaleSequential` with `interpolatePuBu` for color encoding, and `scaleTime` for the year axis. Data comes from a CSV of mental health disorders, with country boundaries from World Atlas TopoJSON.

FFelipe Mejías

67% match

Loading thumbnail…

Vega-Lite API Temperatura

This bar chart visualizes population by country for 2015, with bars sorted in descending order and tooltips displaying exact population values on hover. The visualization is built using the Vega-Lite API, which programmatically constructs a Vega-Lite specification through methods like `markBar()` and `encode()`. Data is loaded asynchronously via `d3.csv` from a Gist hosted CSV file, and the chart renders to SVG using Vega. Custom styling is applied through a configuration object to adjust axis labels, ticks, and tooltip appearance.

Mmarquesjr79

66% match