Pogrebnaya

@Pogrebnaya·6 public vizzes

Cars Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the UCI Auto MPG dataset. Red semi-transparent circles represent individual vehicles, revealing a positive correlation between the two attributes. The code uses d3.csv to load data, d3.scaleLinear for both axes, and d3.axisBottom/axisLeft to render ticks with gridlines. SVG rendering displays the title, axis labels, and plotted points with fixed opacity.

Feb 5, 2021

Loading thumbnail…

Fork of Fork of Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the UCI Machine Learning Repository's Auto MPG dataset. Red semi-transparent circles represent individual cars, with axes labeled and a title displayed. The visualization is built with D3 v5, using `d3.csv` to load data, `d3.scaleLinear` for scales, and `d3.axisLeft` and `d3.axisBottom` for axes. Styling is applied via CSS to control circle opacity, tick appearance, and label fonts.

Feb 5, 2021

Loading thumbnail…

Fork of Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the UCI Machine Learning Repository’s Auto MPG dataset. Red semi-transparent circles represent individual cars, revealing the positive correlation between the two variables. The visualization uses D3 v5 with SVG rendering, employing `d3.scaleLinear`, `d3.extent`, `d3.axisBottom`, and `d3.axisLeft` to construct the axes and scales. The code also formats tick labels and adds axis labels and a title within the SVG, with all data loaded asynchronously via `d3.csv`.

Feb 5, 2021

Loading thumbnail…

Fork of HTML Starter

This example displays a minimal SVG visualization with a single x-axis tick at the value 3000, labeled “lkhklh,” positioned within an SVG canvas. It uses D3 v6’s `d3.scaleLinear` and `d3.axisBottom` to construct the axis, with custom `tickValues` and `tickFormat` overrides. The page also logs a Cyrillic string to the browser console. The underlying HTML starter template includes inline CSS for centered text and loads D3 from a CDN, demonstrating a basic setup for integrating D3 with vanilla JavaScript.

Jan 13, 2021

Loading thumbnail…

Fork of Blank Canvas

A full-window SVG renders a single rounded rectangle that fills the entire viewport. The example demonstrates a minimal D3 setup, using `select` to target the `svg` element and setting its `width` and `height` attributes from `document.body.clientWidth` and `clientHeight`. A `rect` is appended with matching dimensions and a corner radius of 40 pixels. The SVG is styled with fixed positioning and hidden overflow, creating a blank canvas with no data or interaction.

Jan 2, 2021

Loading thumbnail…

Fork of D3 Starter

This example demonstrates a minimal D3.js v6 setup by displaying the text “Hello D3 version 6” centered on the page. The visualization uses the `select` API from D3 to target the `body` element and set its text content. The page loads D3 from a CDN, while an external `bundle.js` file runs the JavaScript logic. The HTML applies CSS styling to center and scale the text to a large font size, showing the simplest possible interaction between D3, HTML, and CSS.

Dec 24, 2020