H1b Petition in Different States

H1b Petition in Different States

This interactive visualization displays the number of H-1B visa petitions by case status across different U.S. states, using a stacked bar chart where each bar represents a state and color segments indicate the case status. The chart is built with the Vega-Lite API, which registers Vega and Vega-Lite in a React environment, and uses d3.csv to load immigration data from the Office of Foreign Labor Certification. The visualization sorts states by petition count in descending order and includes tooltips for detailed values.

Ssophburke

94% match

Petition of H1b

A stacked bar chart displays H1-B visa petition numbers across states, where each bar’s stacked segments represent distinct immigration program categories from the Office of Foreign Labor Certification data. Hovering over a legend entry filters the chart, highlighting only the selected program’s bars while dimming others. Built with D3.js, the visualization uses `d3.legend.color`, `d3.layout.stack`, and `d3.tip` for interactive tooltips, rendered as an animated SVG. The x-axis shows petition counts, while the y-axis lists states, encoded via `d3.scale.ordinal`.

85% match

the number of different case status in different states

This visualization is a heatmap showing the number of immigration case petitions for each case status across different U.S. states, using a red color scale to indicate petition counts. It is built with React and D3 v5, leveraging the vega-lite-api’s `markRect` encoding to map states to the x-axis, case statuses to the y-axis, and petition counts to color intensity. The data comes from the Office of Foreign Labor Certification’s H-1B program records, loaded via `d3.csv`, with tooltips revealing exact counts and statuses.

H1B Petition Bar Chart

This visualization presents two bar charts examining H1B visa petitions over time. The first plot uses a stacked bar chart to show petition counts by year, with colors representing different case statuses, while the second displays petition counts with orange indicating full-time positions and blue for part-time roles. Built with Vega-Lite and D3.js, the charts pull data from a CSV file and use Vega-Lite API for rendering. The visualization emphasizes temporal trends in visa applications and employment types across years.

BBrenda199708

Petition of H1b

A stacked bar chart animates H1-B petition counts by case status (certified, denied, withdrawn) across years, using data from the OFLC. Hovering a color-legend entry highlights that status’s bars while fading others, with tooltips showing exact values. Built with D3.js (v3), it uses `d3.layout.stack`, ordinal/linear scales, SVG axes, and `d3.legend.color`. Bars are rendered in two layers—a base layer and an interactive foreground—with a semi-transparent overlay controlling emphasis. Custom SI tick formatting labels large totals.

H1B Petition Bar Chart

Two side-by-side bar charts examine H1B visa petitions over time. The left chart uses a stacked bar layout, colored by case status, to show petition counts per year. The right chart compares full-time versus part-time positions using orange and blue bars. Both are built with Vega-Lite and D3, rendering from a CSV dataset, with tooltips for detailed category values.

H1b Data With D3 React

This chart shows the number of H-1B visa petitions filed per year, with bars representing the total count for each year. The visualization uses React components to render SVG elements, with D3 v5 providing the scales and data loading through the `csv` and `scaleBand`/`scaleLinear` APIs. Data comes from the Office of Foreign Labor Certification via a GitHub gist, and the bars are positioned using the x and y scales, with axis labels generated by custom React components.

81% match

H1b Data with D3 React

This example visualizes the number of H-1B visa petitions across U.S. states, displaying only the top 20 states in descending order as horizontal bars. The chart uses D3 scales (`scaleBand` and `scaleLinear`) within a React component, rendering SVG rectangles via the `Marks` component. Axes are custom-built with `AxisBottom` and `AxisLeft`, and data is loaded asynchronously from a CSV file hosted on GitHub Gist using D3’s `csv` function. The styling applies a Poppins font and teal bar fills.