Skip to content

MechanicKim/react-native-tag-cloud

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-native-tag-cloud

View for Tag cloud

Introduction

This idea is simple. Each tags include title and point.
In this version, It seems that tags are placed randomly but there are some rules of placement.
Some tags that have highest point are placed in middle of arrays thought ordering.
For example, if your tag list is as follow,

[
  { title: 'Item1', point: 1 },
  { title: 'Item2', point: 2 },
  { title: 'Item3', point: 1 },
  { title: 'Item4', point: 0 },
  { title: 'Item5', point: 1 },
  { title: 'Item6', point: 1 },
  { title: 'Item7', point: 2 },
  { title: 'Item8', point: 0 },
  { title: 'Item9', point: 0 },
  { title: 'Item10', point: 1 },
]

the list will be ordered like this.

  [
    { title: 'Item8', point: 0 },
    { title: 'Item10', point: 1 },
    { title: 'Item5', point: 1 },
    { title: 'Item1', point: 1 },
    { title: 'Item2', point: 2 },
    { title: 'Item7', point: 2 },
    { title: 'Item3', point: 1 },
    { title: 'Item6', point: 1 },
    { title: 'Item4', point: 0 },
    { title: 'Item9', point: 0 },
  ]

react-native-tag-cloud needs to be enhanced. So any ideas are welcome!

Usage

To use this, import the TagCloud object:

import { TagCloud } from 'react-native-tag-cloud';

Use TagCloud like this.

<TagCloud
  tagList={...}
  colorList={...}
  minFontSize={...}
  style={...}
/>

Properties

  1. tagList (Required)
    The item of list must have title and point
    point should be integer type(0 ~ N)

  2. colorList (Requried)
    Each color value corresponds to point of tag object.

  3. minFontSize (Optional)
    This will decide the minimum font size of each tag.
    Default size is 12.

  4. style (Optional)
    This style is for container.

  5. tagPaddingLeft, tagPaddingTop, tagPaddingRight, tagPaddingBottom (Optional)
    Default value is 30.

About

React Native View for Tag cloud

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published