100%

Interactive Color Legend on Scatter Plot CISSM_CyberAttacks

✓ Published0🌍 Public

Last edited Feb 20, 2024

Created on Feb 20, 2024

Forked from CISSM_CyberAttacks (Fork of Simple Scatter Plot)

This interactive scatter plot visualizes cyber attack events from the CISSM Cyber Attacks dataset, mapping event dates on the x-axis and attack actors on the y-axis. Each circle is color-coded by industry type using d3.scaleOrdinal with schemeCategory10, and the color legend displays the industry categories. The visualization uses d3.scalePoint for both axes, with axis labels generated through custom helper functions. Data comes from the @python-monty/cyber_attacksv2 package, and the chart includes an inner rectangle background to delineate the plotting area.

AI-generated description

A simple scatter plot with D3 showing the CISSM Cyber Attacks CISSM-EDA

Challenge

Fork this viz
Modify it to show your data

MIT Licensed

Similar vizzes

Loading thumbnail…

CISSM_CyberAttacks (Fork of Simple Scatter Plot)

This scatter plot visualizes CISSM cyber attack records, plotting event dates on the x-axis against attacker actors on the y-axis. Each circle is color-coded by the affected industry using D3’s `scaleOrdinal` and `schemeCategory10`. The visualization uses D3’s `scalePoint` for both axes and renders axis labels via the `@python-monty/axis_labels` library. The underlying data comes from the CISSM-EDA dataset, and the code forks an existing example to replace the sample data with cyber attack records.

Ccoreyfnolan@gmail.com

91% match

Loading thumbnail…

CISSM_CyberAttacks - Iterated

This example uses an iterated scatter plot to visualize cyber attack events from the CISSM Cyber Attacks dataset, plotting event date along the x-axis against the responsible actor on the y-axis. Each circle is colored by the industry targeted, using the `scaleOrdinal` and `schemeCategory10` schemes. The visualization leverages D3's `scalePoint` for both axes and renders data from the `@python-monty/cyber_attacksv2` package, with axis labels and a background rect for clarity. The code filters the data through custom `viz` and `axis_labels` modules built on D3 7.8.5.

Ccoreyfnolan@gmail.com

90% match

Loading thumbnail…

Fork of Scatter Plot with Color

This example presents a scatter plot of Cyber Attack data from the University of Maryland CISSM database, showing the relationship between event date and attacker actor, colored by industry type. A color legend and brush interaction allow users to highlight specific data points, which update the circle strokes dynamically. The visualization uses d3.scalePoint for both axes, d3.scaleOrdinal with schemeCategory10 for coloring, and a d3.brush to handle selection. Axes and legend are rendered through custom functions that leverage d3.axisLeft, d3.axisBottom, and d3-selection methods.

Ccoreyfnolan@gmail.com

86% match

Loading thumbnail…

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.

Ccoreyfnolan@gmail.com

83% match

Loading thumbnail…

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.

Ccoreyfnolan@gmail.com

82% match

Loading thumbnail…

Fork of Cyber Attacks by Year v3

This fork of the Cyber Attacks by Year visualization displays annual cyber attack counts from 2014 to 2023, with multiple colored lines representing different industry codes. The chart uses D3.js with a time-scaled x-axis, linear y-axis, and an ordinal color scale based on the category10 scheme. Responding to mouse position, it draws red crosshair lines and uses axis labeling methods from the `@python-monty/corey-responsive-axis` library. The data originates from the CISSM Cyber Attacks database, and the visualization is implemented using `svg`, `scaleTime`, `scaleLinear`, `line`, and `flatGroup` APIs.

Ccoreyfnolan@gmail.com

80% match

Loading thumbnail…

Cyber Attacks by Year

This line chart displays the number of cyber attacks per year from the CISSM dataset. The visualization uses a simple black line against a light gray plot area, with labeled axes for year and attack count. Built with D3.js, the chart employs `scaleBand` for the x-axis and `scaleLinear` for the y-axis to position data points, which are connected using the `line` generator. The code also integrates the `corey-responsive-axis` library for axis labels and utilizes a reactive layout for resizing.

Ccoreyfnolan@gmail.com

78% match

Loading thumbnail…

Cyber Attacks by Year v2 w/ Responsive Axes

This line chart visualizes annual cyber attack counts from the CISSM Cyber Attacks dataset, with hover guides that track the mouse position. The visualization uses D3 scales and axes rendered via custom `xAxis` and `yAxis` functions from the `corey-responsive-axis` package, which adapt to container resizing through `observeResize`. The line is drawn using D3’s `line` generator with a time scale for years and a linear scale for attack counts. Data was pre-processed in Python before being imported into the VizHub environment.

Ccoreyfnolan@gmail.com

78% match