Mohammad Shakirul Islam

@shakirul15-311·5 public vizzes

Bangladesh map interaction

A map of Bangladesh displays sales data for each division, with hover tooltips showing yearly, monthly, and weekly figures in BDT. Using d3.geoMercator and d3.geoPath, the visualization renders TopoJSON geographic boundaries as SVG paths, while a sales JSON dataset is joined to district names. The map supports zoom and drag interactions through d3.zoom, and d3.select appends text labels for the title and instructions. District paths change color on hover.

Nov 23, 2022

Loading thumbnail…

BC School Districts

This interactive map of British Columbia school districts displays district boundaries as SVG paths within a React application. Each district is rendered as a clickable region, with a mouseover effect that highlights the area using CSS transitions. The visualization uses raw SVG path data from a locator map of the Bulkley-Nechako regional district, styled with a custom stylesheet that sets a blue background and white district fills with dark strokes. The page links to a separate chart (chart03.html) for additional district information.

Nov 23, 2022

Loading thumbnail…

Fork of Religions of Largest 20 Countries

This stacked bar chart shows the estimated 2010 religious breakdown of the world’s 20 most populous countries, using data from the Pew Research Center’s Global Religious Landscape. Each bar represents a country’s total population, segmented by religion and colored using a categorical scale. Animations are present, and hovering over bars reveals tooltips with exact counts, while hovering over the legend highlights specific religions by fading out others. The visualization is built with D3 v3, using stacked layouts, ordinal and linear scales, and the d3-tip and d3-legend libraries for interactivity.

Nov 22, 2022

Loading thumbnail…

Untitled

This example shows an interactive map of Canada where hovering over a province highlights it in red and displays a tooltip with the province name. The tooltip follows the mouse position and is hidden on mouseout. The map is rendered as SVG paths using D3 v7’s `d3.geoPath` with a `d3.geoAlbers` projection, and the geographic data comes from a GeoJSON file hosted on GitHub. CSS classes control the hover color change and tooltip visibility.

Nov 22, 2022

Loading thumbnail…

Fork of Hello HTML

This example demonstrates a minimal HTML page that displays the text “Test test2” in a browser. It uses the plain HTML structure defined in the `index.html` file, with a `<title>` element and a `<body>` containing the text content. The project is a fork of a bare-bones HTML template, and it relies on no external libraries or JavaScript beyond standard HTML markup. The associated README file includes an embedded YouTube iframe, but the rendered page does not incorporate any interactive or data-driven visualization, showing only static content.

Oct 6, 2022