devmadhuu commented on code in PR #5090:
URL: https://github.com/apache/ozone/pull/5090#discussion_r1282981123
##########
hadoop-ozone/recon/src/main/resources/webapps/recon/ozone-recon-web/src/views/heatMap/heatMapConfiguration.tsx:
##########
@@ -16,80 +16,77 @@
* limitations under the License.
*/
-import React, { Component } from 'react';
+import React from 'react';
import { AgChartsReact } from 'ag-charts-react';
-import {byteToSize} from 'utils/common';
+import { byteToSize } from 'utils/common';
-export default class HeatMapConfiguration extends Component {
- constructor(props: {} | Readonly<{}>) {
- super(props);
- const { data } = this.props;
+interface ITreeResponse {
+ label: string;
+ children: IChildren[];
+ size: number;
+ path: string;
+ minAccessCount: number;
+ maxAccessCount: number;
+}
- const colorRange1 = [
- '#ffff99', //yellow start 80%
- '#ffff80', //75%
- '#ffff66', //70%
- '#ffff4d', //yellow 65%
- '#ffd24d', //dark Mustered yellow start 65%
- '#ffbf00', //dark Mustard yellow end 50%
- '#b38600', //Dark Mustard yellow 35%
- '#ffb366', //orange start 70%
- '#ff9933', //orange 60%
- '#ff8c1a', //55%
- '#e67300', //45%
- '#994d00', //orange end 30%
- '#ff6633', //Red start 60%
- '#ff4000', // Red 50%
- '#cc3300', //40%
- '#992600', //30%
- '#802000', //25%
- '#661a00', //20%
- '#4d1300', // 15%
- '#330000', //dark Maroon
- '#330d00', //10 % Last Red
- ];
+interface IChildren {
+ label: string;
+ size: number;
+ accessCount: number;
+ color: number;
+}
+
+interface IHeatmapConfigurationProps {
+ data: ITreeResponse[];
+ onClick: Function;
+ colorScheme: string[];
+}
+export default class HeatMapConfiguration extends
React.Component<IHeatmapConfigurationProps> {
+ constructor(props: IHeatmapConfigurationProps) {
+ super(props);
+ const { data, colorScheme } = this.props;
this.state = {
// Tree Map Options Start
options: {
data,
- series: [
- {
+ series: [{
type: 'treemap',
labelKey: 'label',// the name of the key to fetch the label value
from
sizeKey: 'normalizedSize',// the name of the key to fetch the value
that will determine tile size
- colorkey: 'color',
- fontSize: 35,
- title: { color: 'white', fontSize: 18, fontFamily:'Courier New' },
- subtitle: { color: 'white', fontSize: 15, fontFamily:'Courier New' },
+ colorKey: 'color',
+ title: { color: '#424242', fontSize: 16, fontFamily: 'Roboto',
fontWeight: '600' },
Review Comment:
any reason we changed from white to gray here ?
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]