
console.log("Just making sure it works.")

Just making sure it works.


import { DOMParser, SVGElement } from 'npm:linkedom'
import { json } from "npm:d3-fetch"
import * as Plot from "npm:@observablehq/plot"


const document = new DOMParser().parseFromString (`<!DOCTYPE html><html lang="en"></html>`, "text/html")


const krLong = (
  await json(
    "https://greynoise-intelligence.github.io/labs-viz-data/kev-ransom-short-long.json"
  )
).map((d) => ({
  cveID: d.cveID,
  shortDescription: d.shortDescription,
  event: d.event,
  date: new Date(d.date)
}))


krLong[0]

{
  cveID: "CVE-2009-3960",
  shortDescription: "Adobe BlazeDS, which is utilized in LifeCycle and Coldfusion, contains a vulnerability that allows f"... 26 more characters,
  event: "Added to KEV",
  date: 2022-03-07T00:00:00.000Z
}


const krShort = (
  await json(
    "https://greynoise-intelligence.github.io/labs-viz-data/kev-ransom-short.json"
  )
).map((d) => {
  d["Added to KEV"] = new Date(d["Added to KEV"]);
  d["CVE Published"] = new Date(d["CVE Published"]);
  return d;
})


krShort[0]

{
  cveID: "CVE-2009-3960",
  "Added to KEV": 2022-03-07T00:00:00.000Z,
  "CVE Published": 2010-02-15T00:00:00.000Z,
  shortDescription: "Adobe BlazeDS, which is utilized in LifeCycle and Coldfusion, contains a vulnerability that allows f"... 26 more characters
}


const plt = Plot.plot({
  document: document,
  className: "kevPlot",
  title:
    "Time From Ransomware-related CVE Publish To KEV Add Is Getting Shorter",
  subtitle: "Updated daily; Hover over dots for CVE details.",
  caption: "Source: CISA KEV",
  marginLeft: 120,
  width: "900",
  height: 900*3,
  style: {
    color: "black",
    stroke: "black",
    fontFamily: "Inconsolata, monospace",
    fontSize: 14
  },
  x: {
    grid: true
  },
  y: {
    domain: krShort.map((d) => d.cveID).reverse(),
    label: null
  },
  color: {
    legend: true
  },
  marks: [
    Plot.ruleY(krShort, {
      y: "cveID",
      x1: "CVE Published",
      x2: "Added to KEV",
      strokeWidth: 0.25,
      stroke: "black"
    }),
    Plot.dot(krLong, {
      x: "date",
      y: "cveID",
      strokeWidth: 0.125,
      fill: "event",
      title: (d) => `${d.cveID}: ${d.shortDescription}`
    })
  ]
})

plt

Import some bits from NPM¶

There is no "document" so we need a virtual one so D3/Plot can render properly¶

Import some CISA KEV CVE mangled data and take a peek¶

Set up the plot¶

Render it¶

Time From Ransomware-related CVE Publish To KEV Add Is Getting Shorter

Updated daily; Hover over dots for CVE details.