123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354 |
- import React from "react";
- import data from "./evaluation/metrics.json";
- import {Table} from 'reactstrap';
- import "./css/maps.css";
- export default class Google extends React.Component{
- render() {
- let categoryRow;
- let metricRows = data.metrics.map((m, idx, metrics) => {
- if(idx === 0 || metrics[idx-1].category!==m.category){
- categoryRow = (<tr><th colSpan="3">{m.category}</th></tr>);
- }else{
- categoryRow = <></>
- }
- return (
- <>
- {categoryRow}
- <tr key={idx}>
- <td>{m.metric}</td>
- <td>{m.rating[this.props.mapId]}</td>
- <td>{m.comments[this.props.mapId]}</td>
- </tr>
- </>
- )
- })
- return (
- <div>
- <Table>
- <tbody>
- <tr>
- <th>Metrik</th>
- <th>Bewertung</th>
- <th>Kommentar</th>
- </tr>
- {metricRows}
- </tbody>
- </Table>
- </div>
- );
- }
- }
- //
- // <tr> for every metrik
- //
- // if category != oldCat:
- // <td> cat name in bold
- // </tr>
- // <tr>
- //
- // <td> metrik name
- // <td> if map == mapname
- // </tr>
|