Challenge

Cyber Attacks by Year/Industry

This example displays the first ten rows of a dataset on cyber attacks, showing the number of attacks per industry and year. The parsed quantitative values are formatted as JSON in a pre tag, using the d3 library for data parsing. The data comes from a CSV file detailing industry codes, years, and attack counts across various sectors. The visualization demonstrates a simple data inspection approach, converting raw CSV data into viewable structured text.

84% match

Cyber_Attacks_V2

This example displays the first record from a dataset of cyber attacks, showing parsed fields such as the event date, actor, organization, industry, and motive. The code imports data from a CSV file and uses D3’s `utcParse` to convert the date strings into JavaScript `Date` objects, extracting the year for each entry. It also coerces the `industry_code` column into a numeric value with the unary plus operator. The visualization renders the resulting JSON representation of a single data point in a styled `<pre>` element, demonstrating the initial data processing and output structure.

82% match

CyberAttacks Final Draft

This visualization presents cyber attack data from 2014 to 2023 through two linked panels. The left panel uses d3’s `line` generator and `scaleTime`/`scaleLinear` to show attack counts per industry over time, with a custom color legend supporting twenty categories. The right panel displays filtered scatter plot data using `scalePoint`, showing attack types by year for a selected industry, with actor-based coloring. Interaction includes hover highlighting and click-based filtering, implemented through d3 selection joins and event handlers.

82% match

Yearly Cyber Attack Data

This visualization presents yearly cyber attack counts from the CISSM Cyber Attacks dataset, showing fluctuations from 2014 to 2023 with a notable spike in 2022. The code parses the CSV data, converting year strings to Date objects and attack counts to numbers using `Date.UTC` before displaying the first ten records as JSON. It relies on the d3 library version 7.8.5 for data handling and rendering, though the current implementation only outputs the parsed data structure rather than a graphical chart.

82% match

CyberAttacks Final Draft v5

Two coordinated visualizations explore cyber attack data from 2014 to 2023. A multi-line chart displays attack counts per industry over time, with a clickable color legend; selecting an industry filters the adjacent scatter plot to show only that sector's attacks by year and attack type, colored by actor. The scatter plot supports d3.brush for highlighting points. The code uses d3.scaleOrdinal, d3.line, d3.axisLeft, and d3.axisBottom, rendering as SVG with data sourced from a local dataset.

CyberAttacks LineChart - Final Project Draft v1

This interactive line chart visualizes annual cyber attack counts across selected industry sectors from 2018 onward. Users can select up to three industry codes via dropdown menus to compare attack trends over time, with each industry represented by a distinct colored line. The visualization is built with D3.js and uses the CISSM Cyber Attacks dataset, encoding years on the x-axis and attack counts on the y-axis. The chart includes a color legend and hover interactions to highlight specific data points.

CyberAttacks Combined Vizs- Final Project Draft v4 (all data version)

This visualization uses D3.js to combine a multi-line chart and a scatter plot on a single page, presenting cyber attack data across industries and years. The line chart shows attack counts over time per industry, with a color legend that filters the scatter plot by industry. The scatter plot displays individual attack events by date and attack type, using D3’s brush behavior to highlight selected points. Both charts rely on D3 scales (scaleTime, scalePoint, scaleOrdinal) and custom axis and legend modules, rendering as SVG. Data is sourced from the `@python-monty/full_cyber_attack_data` package.

CyberAttacks LineChart - Final Project Draft v2

This interactive line chart displays annual cyber attack counts across industry sectors, using data from the CISSM Cyber Attacks dataset. Three drop-down menus allow viewers to select up to three industry codes, and the chart renders a multi-line visualization with a color legend that updates dynamically. Built with D3.js, the visualization employs `flatGroup`, `scaleOrdinal`, and `schemeCategory10` to group and color lines, while custom axis and color legend modules handle responsive rendering. The chart includes an inner rectangle background and labeled axes showing year and attack counts for the filtered industries.