Additional D3 symbol types.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
img
src
test
.gitignore
.npmignore
LICENSE
README.md
index.js
package.json

README.md

d3-symbol-extra

Additional D3 symbol types.

For use with D3 version 4+.

Demo

A demo is available here.

Installing

If you use NPM, npm install d3-symbol-extra. Otherwise, download the latest release. AMD, CommonJS, and vanilla environments are supported. In vanilla, a d3 global is exported:

  <script src="https://d3js.org/d3.v4.min.js"></script>
  <script src="d3-symbol-extra.js"></script>

  <svg width="100" height="100"></svg>
  <script>

  var symbol = d3.symbol().size(1000).type(d3.symbolPentagon);
  d3.select('svg').append('path')
    .attr('transform', 'translate(50, 50)')
    .attr('d', function(d, i) {
      return symbol();
    });

  </script>

API Reference

Symbols

# d3.symbolTriangleDown <>

The triangle symbol type rotated 180°. See d3.symbolTriangle.

# d3.symbolTriangleLeft <>

The triangle symbol type rotated 90° counterclockwise. See d3.symbolTriangle.

# d3.symbolTriangleRight <>

The triangle symbol type rotated 90° clockwise. See d3.symbolTriangle.

# d3.symbolDiamondAlt <>

The diamond symbol type laid horizontally. See d3.symbolDiamond.

# d3.symbolDiamondSquare <>

The square symbol type rotated 45°. See d3.symbolSquare.

# d3.symbolPentagon <>

The pentagon symbol type.

# d3.symbolHexagon <>

The hexagon symbol type.

# d3.symbolHexagonAlt <>

The hexagon symbol type rotated to have horizontal top and bottom edges.

# d3.symbolOctagon <>

The octagon symbol type.

# d3.symbolOctagonAlt <>

The octagon symbol type rotated to have horizontal top and bottom edges.

# d3.symbolX <>

The Greek cross symbol type rotated 45°. Alias: d3.symbolCrossAlt. See d3.symbolCross.