react-native-daily-activity v1.1.0

Github style daily activity charts for React Native

Renders the native daily charts component on iOS and Android. Example:

import React from 'react';
import { View } from 'react-native';
import DailyActivityChart from 'react-native-daily-activity';

export default function App()
  const data = {
   '2019/11/1': 3,
    '2019/11/2': 3,
    '2019/11/3': 4,
    '2019/11/4': 5,
    '2019/11/5': 13,
    '2019/11/6': 8,
    '2019/11/7': 12,
    '2019/11/8': 8,
    '2019/11/9': 11,
    '2019/11/10': 13
  }

  render() {
    return (
      <View>
        <DailyActivityChart data={data}/>
      </View>
    );
  }
}

How its look like

Reference

Props

data

Object of data, that holds the one current month reports. Data structure given below.

{
  '2019/11/1': 3,
  '2019/11/2': 3,
  '2019/11/3': 4,
  '2019/11/4': 5,
  '2019/11/5': 13,
  '2019/11/6': 8,
  '2019/11/7': 12,
  '2019/11/8': 8,
  '2019/11/9': 11,
  '2019/11/10': 13
}

specificMonth

Number of month data you are given. If you want to render specific any month rather than current. At this situation, year will be current year if there is no any given value to specificYear. Example:

<DailyActivityChart data={data} specificMonth={3}/>

specificYear

Specific year of data you are given. If you want to render specific any year rather than current. At this situation, month will be current month if there is no any given value to specificMonth. Example:

<DailyActivityChart data={data} specificYear={2017} />

color

Specific color can be set. For setting color, it has to be a HEX color code and most darkest version of choosen color.

Example:

<DailyActivityChart data={data} color={'#0821F3'} />