<commit_before># d3fc-data-join

A component that simplifies the `d3-selection` data join in its most common usage and facilitates the d3fc decorate pattern.

[Main d3fc package](https://github.com/ScottLogic/d3fc)

# Description

A wrapper around D3's data join which simplifies some of the common problems that have run into with *our particular usage patterns*. These are not going to be universally applicable. As always it’s important to understand the abstraction and in many cases a vanilla data join may be simpler or perform better.

This blog post ([Building Components with Data Join](http://blog.scottlogic.com/2016/08/17/building-components-with-d3-data-join.html)) introduces the rationale behind this component.

# Installation

```bash
npm install d3fc-data-join
```

# API

The data-join component is a relatively lightweight wrapper around d3's selectAll/data data-join, which allows decoration of the result. This is achieved by appending the element to the enter selection before exposing it. A default transition of fade in/out is also implicitly added but can be modified.

## data join

<a name="dataJoin" href="#dataJoin">#</a> *fc*.**dataJoin**([*element*[, *className*]])
<commit_msg>docs: make readme format consistent<commit_after># d3fc-data-join

A wrapper around D3's data join which simplifies some of the common problems that have been run into with *our particular usage patterns*, and facilitates the *d3fc decorate* pattern. These are not going to be universally applicable. As always it’s important to understand the abstraction and in many cases a vanilla data join may be simpler or perform better.

This blog post ([Building Components with Data Join](http://blog.scottlogic.com/2016/08/17/building-components-with-d3-data-join.html)) introduces the rationale behind this component.

[Main d3fc package](https://github.com/ScottLogic/d3fc)

## Installing

```bash
npm install d3fc-data-join
```

## API Reference

The data-join component is a relatively lightweight wrapper around d3's selectAll/data data-join, which allows decoration of the result. This is achieved by appending the element to the enter selection before exposing it. A default transition of fade in/out is also implicitly added but can be modified.

<a name="dataJoin" href="#dataJoin">#</a> fc.**dataJoin**([*element*][, *className*])

{'fraction_non_alphanumeric': 0.08571428571428572, 'fraction_numerical': 0.014072494669509595, 'mean_word_length': 4.98469387755102, 'pattern_counts': {'":': 0, '<': 7, '<?xml version=': 0, '>': 7, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3761638', 'n_tokens_mistral': 670, 'n_tokens_neox': 613, 'n_words': 290}