From 7ec26813a0cae0996f2d5873b9bdd1aeede68d41 Mon Sep 17 00:00:00 2001 From: Determinant Date: Mon, 11 Feb 2019 00:13:45 -0500 Subject: support custom color --- src/Chart.js | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) (limited to 'src/Chart.js') diff --git a/src/Chart.js b/src/Chart.js index 983436a..b1c36ed 100644 --- a/src/Chart.js +++ b/src/Chart.js @@ -2,9 +2,9 @@ import React from 'react'; import PropTypes from 'prop-types'; import { withStyles } from '@material-ui/core/styles'; import Grid from '@material-ui/core/Grid'; -import deepOrange from '@material-ui/core/colors/deepOrange'; import cyan from '@material-ui/core/colors/cyan'; import { PieChart, Pie, Cell, Tooltip } from 'recharts'; +import { defaultChartColor } from './theme'; export function getChartData(start, end, patterns, calendars, calEventsGetter) { if (start >= end) return Promise.resolve({ patternGraphData: [], calendarGraphData: [] }); @@ -57,12 +57,15 @@ export function getChartData(start, end, patterns, calendars, calEventsGetter) { majorParts.push({ name: 'Other', value: minorSum, - color: '#fff', + color: defaultChartColor, }); return majorParts; }; for (let i = 0; i < patterns.length; i++) { - patternGraphData.push({ name: patterns[i].name, value: results[i] / 60.0 }); + patternGraphData.push({ + name: patterns[i].name, + value: results[i] / 60.0, + color: patterns[i].color.background}); } for (let id in cal_results) { calendarGraphData.push({ @@ -115,9 +118,11 @@ function PatternPieChart(props) { cx={200} cy={125} outerRadius={60} - fill={deepOrange[300]} + fill={defaultChartColor} isAnimationActive={false} - label={customizedLabel}/> + label={customizedLabel}> + {props.data.map((d, i) => )} + `${value.toFixed(2)} hr`}/> @@ -143,7 +148,7 @@ function DoublePieChart(props) { fill={cyan[300]} isAnimationActive={false} label={customizedLabel}> - {props.calendarGraphData.map((d, i) => )} + {props.calendarGraphData.map((d, i) => )} `${value.toFixed(2)} hr`}/> -- cgit v1.2.3