Commit 560111dc authored by Matija Obreza's avatar Matija Obreza
Browse files

Updated climate display


Signed-off-by: Matija Obreza's avatarMatija Obreza <matija.obreza@croptrust.org>
parent 8a65116a
......@@ -402,7 +402,12 @@
"MCPD": "MCPD",
"zip": "ZIP",
"climateAtCollection": "Climate at origin",
"additionalInfo": "Bioclimatic variables"
"additionalInfo": "Bioclimatic variables",
"climateSimilar": {
"title": "Accessions with similar climatic properties",
"intro": "Georeferenced accesions in Genesys are linked to their climate data based on worldclim.org datasets. Genesys will try to find similar georeferenced accessions that match the basic climatic parameters: annual mean temperature, seasonality and rainfall.",
"view": "List accessions"
}
},
"browse": {
"title": "Accession browser",
......
......@@ -59,7 +59,12 @@
"MCPD": "MCPD",
"zip": "ZIP",
"climateAtCollection": "Climate at origin",
"additionalInfo": "Bioclimatic variables"
"additionalInfo": "Bioclimatic variables",
"climateSimilar": {
"title": "Accessions with similar climatic properties",
"intro": "Georeferenced accesions in Genesys are linked to their climate data based on worldclim.org datasets. Genesys will try to find similar georeferenced accessions that match the basic climatic parameters: annual mean temperature, seasonality and rainfall.",
"view": "List accessions"
}
},
"browse": {
"title": "Accession browser",
......
......@@ -16,6 +16,7 @@ import TemperatureChart from 'accessions/ui/c/TemperatureChart';
import { Properties, PropertiesItem } from 'ui/common/Properties';
import ActionButton from 'ui/common/buttons/ActionButton';
const BioClimateDisplay = ({climateData, t, extraFilters, applyClimateFilters, ...rest}: {climateData: TileClimate, t: any, extraFilters?: any, applyClimateFilters: any}) => {
const doFilters = () => {
console.log(`Applying climate filters`, climateData, extraFilters);
......@@ -23,30 +24,32 @@ const BioClimateDisplay = ({climateData, t, extraFilters, applyClimateFilters, .
};
return (
<div>
<PageSection title={ t('accessions.public.p.display.climateAtCollection') } { ...rest }>
<GridContainer className="container-spacing-vertical">
<TemperatureChart halfWidth climate={ climateData }/>
<PrecipitationChart halfWidth climate={ climateData }/>
</GridContainer>
<div>
<ClimateTable climate={ climateData }/>
<PageSection title={ t('accessions.public.p.display.climateAtCollection') } { ...rest }>
<GridContainer className="container-spacing-vertical">
<TemperatureChart halfWidth climate={ climateData }/>
<PrecipitationChart halfWidth climate={ climateData }/>
</GridContainer>
<div>
<ClimateTable climate={ climateData }/>
</div>
</PageSection>
<PageSection title={ t('accessions.public.p.display.additionalInfo') }>
<Properties>
{ [...Array(19).keys()].map((i) => (
<PropertiesItem md numeric key={ `month-${i}` } title={ t(`accessions.climate.bio${i + 1}`) }>
{ climateData[`bio${i + 1}`] && Number(climateData[`bio${i + 1}`]).toFixed(1) }
</PropertiesItem>
)) }
</Properties>
<div style={ { marginTop: '1em' } }>
<h4>{ t('accessions.public.p.display.climateSimilar.title') }</h4>
<p>{ t('accessions.public.p.display.climateSimilar.intro') }</p>
<ActionButton action={ doFilters } title={ t('accessions.public.p.display.climateSimilar.view') } />
</div>
</PageSection>
</div>
</PageSection>
<PageSection title={ t('accessions.public.p.display.additionalInfo') }>
<Properties>
{ [...Array(19).keys()].map((i) => (
<PropertiesItem md numeric key={ `month-${i}` } title={ t(`accessions.climate.bio${i + 1}`) }>
{ climateData[`bio${i + 1}`] && Number(climateData[`bio${i + 1}`]).toFixed(1) }
</PropertiesItem>
)) }
</Properties>
<div>
<ActionButton action={ doFilters } title="View accessions with similar climate" />
</div>
</PageSection>
</div>
);
);
};
const mapDispatchToProps = (dispatch) => bindActionCreators({
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment