caliew

@caliew·2 public vizzes

Shapes With SVG and CSS

This example demonstrates how SVG shapes can be styled using both inline attributes and CSS classes. Circles, lines, and a path are rendered inside an SVG element, with a green stroke applied to line elements and a blue stroke with rounded joins to the path. The code uses basic SVG elements (`circle`, `line`, `path`, `g`) and CSS selectors to control fill and stroke properties, including a group-level fill override with a red stroke. The HTML page loads a stylesheet and scales the entire drawing with an SVG transform.

Dec 28, 2019

Loading thumbnail…

CAR REPORTr

This example displays a plain-text report of cars priced under $1500, formatted as "$year $make $model:$price" and output in a large HTML `<pre>` element. The report is generated by filtering a hardcoded JSON array of seven car objects, then mapping each car through a `formatCar` function and joining the results with newlines. The code imports the car data and formatter from separate ES modules and uses React 16.10 alongside the ReactDOM production builds, though the output itself is written directly to the DOM via `document.getElementById` rather than through React rendering.

Dec 28, 2019