Skip to content

Commit

Permalink
bootstrap v1 repo
Browse files Browse the repository at this point in the history
  • Loading branch information
chrisrzhou committed Feb 11, 2019
1 parent fb65239 commit dd2239e
Show file tree
Hide file tree
Showing 16 changed files with 3,004 additions and 3,124 deletions.
13 changes: 10 additions & 3 deletions .babelrc
@@ -1,4 +1,11 @@
{
"presets": ["es2015", "flow", "react", "stage-0"],
"plugins": ["transform-flow-strip-types"]
}
"presets": [
[
"@babel/env",
{
"loose": true
}
],
"@babel/react"
]
}
5 changes: 5 additions & 0 deletions .eslintignore
@@ -0,0 +1,5 @@
# Third party
**/node_modules

# Build
dist/
61 changes: 35 additions & 26 deletions .eslintrc
@@ -1,30 +1,39 @@
/*
yarn add --dev \
eslint-config-fbjs \
eslint-config-prettier \
eslint-plugin-babel \
eslint-plugin-flowtype \
eslint-plugin-jsx-a11y \
eslint-plugin-prettier \
eslint-plugin-react \
eslint-plugin-relay \
eslint \
babel-eslint
*/

{
extends: ['fbjs', 'prettier'],
plugins: ['prettier'],
rules: {
'prettier/prettier': [
'error',
"env": {
"browser": true,
"node": true
},
"parser": "babel-eslint",
"extends": [
"eslint:recommended",
"plugin:react/recommended",
"prettier"
],
"plugins": [
"prettier"
],
"rules": {
"no-unused-vars": [
2,
{
bracketSpacing: false,
jsxBracketSameLine: true,
singleQuote: true,
trailingComma: 'all',
useTabs: false,
},
"ignoreRestSiblings": true
}
],
"prettier/prettier": [
"error",
{
"bracketSpacing": true,
"jsxBracketSameLine": true,
"singleQuote": true,
"trailingComma": "all",
"useTabs": false
}
]
},
}
"settings": {
"react": {
"pragma": "React",
"version": "^16.8.0"
}
}
}
17 changes: 8 additions & 9 deletions .gitignore
Expand Up @@ -2,14 +2,13 @@
node_modules

# logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
*.log*

# others
*.swo
# files and IDE
.DS_STORE
*~
*.swp
*.*~
.DS_Store
*.swo

# project
dist
12 changes: 6 additions & 6 deletions LICENSE
@@ -1,6 +1,6 @@
MIT License
The MIT License (MIT)

Copyright (c) 2017 Chris Zhou
Copyright (c) 2017 Chris Zhou <christopher.r.zhou@gmail.com>

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
Expand All @@ -9,13 +9,13 @@ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
46 changes: 25 additions & 21 deletions README.md
@@ -1,23 +1,21 @@
# React Wordcloud
Powerful React + D3 word cloud component with rich features. Based on the
original word cloud generator: https://www.jasondavies.com/wordcloud/.

![Example cloud of Twitter search results for “amazing”](http://www.jasondavies.com/wordcloud/amazing.png)
React + D3 word cloud component with rich features. Uses the [`d3-cloud`](https://github.com/jasondavies/d3-cloud) layout.

![image](./wordcloud.png)

## Install
Add to `package.json` with `yarn` or `npm`.

```bash
yarn add https://github.com/chrisrzhou/react-wordcloud.git
```

## Usage
## Simple Example

This is a simple example using minimal props.
Using only required props:
```js
import * as React from 'react';

import ReactWordCloud from 'react-wordcloud';
import ReactWordcloud from 'react-wordcloud';

const words = [
{word: 'hello', value: 3},
Expand All @@ -26,16 +24,16 @@ const words = [
{word: 'code', value: 1},
];

const WORD_COUNT_KEY = 'value';
const WORD_KEY = 'word';
const wordCountKey = 'value';
const wordKey = 'word';

const MyWordCloud = () => {
function MyWordcloud() {
return (
<div style={{width: 600, height: 400}}>
<ReactWordCloud
words={words}
wordCountKey={WORD_COUNT_KEY}
wordKey={WORD_KEY}
<ReactWordcloud
words={words}
wordCountKey={wordCountKey}
wordKey={wordKey}
/>
</div>
);
Expand All @@ -44,12 +42,18 @@ const MyWordCloud = () => {
export default MyWordCloud;
```

## Word Cloud Generator Example
Check out the code in this [word cloud generator](https://github.com/chrisrzhou/wordcloud-generator)
to see how to use `react-wordcloud` in production.
## Documented Examples
View all documented examples at https://worcloud.chrisrzhou.io.

This generator allows you to tweak many properties of the word cloud component.
You can also run the examples locally:
```bash
yarn dev
```

It also demonstrates how we can parse string into words, and bind click actions
on the words to highlight their occurrences in the original text.
## Wordcloud Generator
Create wordclouds using this [wordcloud generator](https://github.com/chrisrzhou/wordcloud-generator).

The generator supports:
- Copy/paste/edit/upload text inputs
- Wordcloud configurations
- Export/save/share wordclouds

0 comments on commit dd2239e

Please sign in to comment.