Skip to content

Commit f7e40f9

Browse files
authored
Merge pull request #31 from devinit/release/v1.3.11
Release | v1.3.11
2 parents f0ae828 + 717834f commit f7e40f9

File tree

8 files changed

+80
-131
lines changed

8 files changed

+80
-131
lines changed

assets/core.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

assets/vendor.js

Lines changed: 4 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "gha-data-visualisations",
3-
"version": "1.3.10",
3+
"version": "1.3.11",
44
"description": "A Starting Point for Creating DI's D3 Charts",
55
"private": true,
66
"scripts": {

public/assets/data/donor_interactive_data_long.csv

Lines changed: 0 additions & 90 deletions
Original file line numberDiff line numberDiff line change
@@ -29,16 +29,6 @@ Year,IHA type,Value type,Donor,Value
2929
2019,Total HA,%GNI,Belgium,0.00057118
3030
2020,Total HA,%GNI,Belgium,0.00073225
3131
2021,Total HA,%GNI,Belgium,0.00087459
32-
2012,Total HA,%GNI,Bulgaria,0.00009484
33-
2013,Total HA,%GNI,Bulgaria,0.00010155
34-
2014,Total HA,%GNI,Bulgaria,0.00013087
35-
2015,Total HA,%GNI,Bulgaria,0.00010594
36-
2016,Total HA,%GNI,Bulgaria,0.00013518
37-
2017,Total HA,%GNI,Bulgaria,0.00017635
38-
2018,Total HA,%GNI,Bulgaria,0.00011386
39-
2019,Total HA,%GNI,Bulgaria,0.00010782
40-
2020,Total HA,%GNI,Bulgaria,0.00018451
41-
2021,Total HA,%GNI,Bulgaria,0.00023032
4232
2012,Total HA,%GNI,Canada,0.00030118
4333
2013,Total HA,%GNI,Canada,0.00036693
4434
2014,Total HA,%GNI,Canada,0.0004106
@@ -49,16 +39,6 @@ Year,IHA type,Value type,Donor,Value
4939
2019,Total HA,%GNI,Canada,0.00038239
5040
2020,Total HA,%GNI,Canada,0.00041467
5141
2021,Total HA,%GNI,Canada,0.00043986
52-
2012,Total HA,%GNI,Croatia,0
53-
2013,Total HA,%GNI,Croatia,0.00003949
54-
2014,Total HA,%GNI,Croatia,0.00015178
55-
2015,Total HA,%GNI,Croatia,0.00006849
56-
2016,Total HA,%GNI,Croatia,0.00010289
57-
2017,Total HA,%GNI,Croatia,0.00016467
58-
2018,Total HA,%GNI,Croatia,0.00017139
59-
2019,Total HA,%GNI,Croatia,0.00013052
60-
2020,Total HA,%GNI,Croatia,0.000185
61-
2021,Total HA,%GNI,Croatia,0.00043713
6242
2012,Total HA,%GNI,Czech Republic,0.00012229
6343
2013,Total HA,%GNI,Czech Republic,0.00012461
6444
2014,Total HA,%GNI,Czech Republic,0.00015256
@@ -79,16 +59,6 @@ Year,IHA type,Value type,Donor,Value
7959
2019,Total HA,%GNI,Denmark,0.00157683
8060
2020,Total HA,%GNI,Denmark,0.00145888
8161
2021,Total HA,%GNI,Denmark,0.00093537
82-
2012,Total HA,%GNI,Estonia,0.00007703
83-
2013,Total HA,%GNI,Estonia,0.00022588
84-
2014,Total HA,%GNI,Estonia,0.00027156
85-
2015,Total HA,%GNI,Estonia,0.00025485
86-
2016,Total HA,%GNI,Estonia,0.00032078
87-
2017,Total HA,%GNI,Estonia,0.00025642
88-
2018,Total HA,%GNI,Estonia,0.00022987
89-
2019,Total HA,%GNI,Estonia,0.00025077
90-
2020,Total HA,%GNI,Estonia,0.00033109
91-
2021,Total HA,%GNI,Estonia,0.00026868
9262
2012,Total HA,%GNI,EU institutions,
9363
2013,Total HA,%GNI,EU institutions,
9464
2014,Total HA,%GNI,EU institutions,
@@ -199,36 +169,6 @@ Year,IHA type,Value type,Donor,Value
199169
2019,Total HA,%GNI,Korea,0.0000868
200170
2020,Total HA,%GNI,Korea,0.00009257
201171
2021,Total HA,%GNI,Korea,0.00007533
202-
2012,Total HA,%GNI,Kuwait,
203-
2013,Total HA,%GNI,Kuwait,
204-
2014,Total HA,%GNI,Kuwait,
205-
2015,Total HA,%GNI,Kuwait,
206-
2016,Total HA,%GNI,Kuwait,0.00000626
207-
2017,Total HA,%GNI,Kuwait,0.00007351
208-
2018,Total HA,%GNI,Kuwait,0
209-
2019,Total HA,%GNI,Kuwait,0
210-
2020,Total HA,%GNI,Kuwait,0.00026958
211-
2021,Total HA,%GNI,Kuwait,
212-
2012,Total HA,%GNI,Latvia,0.00008659
213-
2013,Total HA,%GNI,Latvia,0.00009212
214-
2014,Total HA,%GNI,Latvia,0.00011293
215-
2015,Total HA,%GNI,Latvia,0.00009661
216-
2016,Total HA,%GNI,Latvia,0.00018536
217-
2017,Total HA,%GNI,Latvia,0.00018441
218-
2018,Total HA,%GNI,Latvia,0.00013789
219-
2019,Total HA,%GNI,Latvia,0.00014221
220-
2020,Total HA,%GNI,Latvia,0.00017107
221-
2021,Total HA,%GNI,Latvia,0.00016576
222-
2012,Total HA,%GNI,Lithuania,0.00009364
223-
2013,Total HA,%GNI,Lithuania,0.00009901
224-
2014,Total HA,%GNI,Lithuania,0.00014256
225-
2015,Total HA,%GNI,Lithuania,0.00015377
226-
2016,Total HA,%GNI,Lithuania,0.0002596
227-
2017,Total HA,%GNI,Lithuania,0.00015081
228-
2018,Total HA,%GNI,Lithuania,0.00016154
229-
2019,Total HA,%GNI,Lithuania,0.00016754
230-
2020,Total HA,%GNI,Lithuania,0.00019604
231-
2021,Total HA,%GNI,Lithuania,0.00023425
232172
2012,Total HA,%GNI,Luxembourg,0.00153638
233173
2013,Total HA,%GNI,Luxembourg,0.00165338
234174
2014,Total HA,%GNI,Luxembourg,0.00174559
@@ -289,26 +229,6 @@ Year,IHA type,Value type,Donor,Value
289229
2019,Total HA,%GNI,Portugal,0.00016917
290230
2020,Total HA,%GNI,Portugal,0.00019208
291231
2021,Total HA,%GNI,Portugal,0.00019808
292-
2012,Total HA,%GNI,Qatar,
293-
2013,Total HA,%GNI,Qatar,
294-
2014,Total HA,%GNI,Qatar,
295-
2015,Total HA,%GNI,Qatar,
296-
2016,Total HA,%GNI,Qatar,
297-
2017,Total HA,%GNI,Qatar,
298-
2018,Total HA,%GNI,Qatar,
299-
2019,Total HA,%GNI,Qatar,0.0007236
300-
2020,Total HA,%GNI,Qatar,0.00181477
301-
2021,Total HA,%GNI,Qatar,
302-
2012,Total HA,%GNI,Romania,0.00009075
303-
2013,Total HA,%GNI,Romania,0.00009142
304-
2014,Total HA,%GNI,Romania,0.00011511
305-
2015,Total HA,%GNI,Romania,0.00009257
306-
2016,Total HA,%GNI,Romania,0.0001817
307-
2017,Total HA,%GNI,Romania,0.00015646
308-
2018,Total HA,%GNI,Romania,0.0001373
309-
2019,Total HA,%GNI,Romania,0.00013851
310-
2020,Total HA,%GNI,Romania,0.00015508
311-
2021,Total HA,%GNI,Romania,0.00019662
312232
2012,Total HA,%GNI,Saudi Arabia,
313233
2013,Total HA,%GNI,Saudi Arabia,
314234
2014,Total HA,%GNI,Saudi Arabia,
@@ -369,16 +289,6 @@ Year,IHA type,Value type,Donor,Value
369289
2019,Total HA,%GNI,Switzerland,0.00057918
370290
2020,Total HA,%GNI,Switzerland,0.00093741
371291
2021,Total HA,%GNI,Switzerland,0.00070228
372-
2012,Total HA,%GNI,Turkey,0.00132977
373-
2013,Total HA,%GNI,Turkey,0.00198987
374-
2014,Total HA,%GNI,Turkey,0.00302233
375-
2015,Total HA,%GNI,Turkey,0.00349807
376-
2016,Total HA,%GNI,Turkey,0.00683723
377-
2017,Total HA,%GNI,Turkey,0.00855306
378-
2018,Total HA,%GNI,Turkey,0.00939257
379-
2019,Total HA,%GNI,Turkey,0.01006814
380-
2020,Total HA,%GNI,Turkey,0.01023595
381-
2021,Total HA,%GNI,Turkey,0.00858543
382292
2012,Total HA,%GNI,UAE,0.00000552
383293
2013,Total HA,%GNI,UAE,0.00023732
384294
2014,Total HA,%GNI,UAE,0.00146435

src/charts/donors.js

Lines changed: 14 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,7 @@
22
import { jsx } from '@emotion/react';
33
import deepMerge from 'deepmerge';
44
import { createRoot } from 'react-dom/client';
5-
import Select from '../components/Select';
6-
import ChartFilters from '../components/ChartFilters';
5+
import DonorChartFilters from '../components/DonorChartFilters';
76
import fetchCSVData, { ACTIVE_BRANCH } from '../utils/data';
87
import { addFilterWrapper } from '../widgets/filters';
98
import defaultOptions, { colorways, getYAxisNamePositionFromSeries, handleResize, legendSelection } from './echarts';
@@ -153,7 +152,7 @@ const updateChart = (chart, data, { donors, channels, years }) => {
153152
filterChannels(channels).map((channel, index) => ({
154153
name: dataType !== '%GNI' ? channel : donor, // GNI only has one channel, so the donors are the series
155154
data: processData(cleanedData, years, donor, channel, dataTypeMapping[dataType]).map((d) => ({
156-
value: d && Number(dataType !== 'Volumes' ? d.value * 100 : d.value), // all other data types are %ages
155+
value: d && typeof d.value === 'number' ? Number(dataType !== 'Volumes' ? d.value * 100 : d.value) : null, // all other data types are %ages
157156
emphasis: {
158157
focus: 'self',
159158
},
@@ -162,6 +161,7 @@ const updateChart = (chart, data, { donors, channels, years }) => {
162161
stack: dataType !== '%GNI' ? donor : undefined, // GNI line chart should not stack
163162
symbol: 'circle',
164163
symbolSize: 10,
164+
connectNulls: type === 'line' ? false : undefined,
165165
tooltip: {
166166
trigger: 'item',
167167
formatter: (params) => {
@@ -237,9 +237,7 @@ const renderDonorsChart = () => {
237237

238238
// add dropdown event listeners
239239
const onSelectDonor = (values) => {
240-
const isAllDonors = values.find((item) => item.value === 'All donors');
241-
242-
if (!values.length || isAllDonors) {
240+
if (!values.length) {
243241
renderDefaultChart(chart, cleanData(data), { years, channels });
244242

245243
return;
@@ -251,7 +249,7 @@ const renderDonorsChart = () => {
251249
};
252250

253251
const onSelectDataType = (value) => {
254-
dataType = value.value || dataType;
252+
dataType = value || dataType;
255253
if (selectedDonors.length) {
256254
const filteredData = data.filter((d) => selectedDonors.includes(d.Donor));
257255
updateChart(chart, filteredData, { donors: selectedDonors, channels, years });
@@ -265,27 +263,15 @@ const renderDonorsChart = () => {
265263
// add dropdowns
266264
const root = createRoot(filterWrapper);
267265
root.render(
268-
<ChartFilters selectErrorMessage={donorSelectErrorMessage}>
269-
<Select
270-
label="Select up to two donors"
271-
options={donors.map((donor) => ({ value: donor, label: donor, isCloseable: donor !== defaultDonor }))}
272-
defaultValue={[{ value: defaultDonor, label: defaultDonor }]}
273-
isMulti
274-
onChange={onSelectDonor}
275-
singleSelectOptions={[{ value: defaultDonor, label: defaultDonor, isCloseable: false }]}
276-
css={{ minWidth: '200px' }}
277-
classNamePrefix="donors-select"
278-
isClearable={false}
279-
/>
280-
<Select
281-
label="Display data as"
282-
options={['Volumes', 'Proportions', '%GNI'].map((item) => ({ value: item, label: item }))}
283-
defaultValue={[{ value: 'Volumes', label: 'Volumes' }]}
284-
onChange={onSelectDataType}
285-
css={{ minWidth: '150px' }}
286-
classNamePrefix="donors-display-data-as"
287-
/>
288-
</ChartFilters>
266+
<DonorChartFilters
267+
selectErrorMessage={donorSelectErrorMessage}
268+
donors={donors}
269+
onSelectDataType={onSelectDataType}
270+
onSelectDonor={onSelectDonor}
271+
defaultDonor={defaultDonor}
272+
defaultDataType="Volumes"
273+
donorSelectErrorMessage={donorSelectErrorMessage}
274+
/>
289275
);
290276

291277
dichart.hideLoading();

src/charts/funding-channels.js

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -187,9 +187,7 @@ const renderFundingChannelsChart = () => {
187187

188188
// add dropdown event handlers
189189
const onSelectDonor = (values) => {
190-
const isAllDonors = values.find((item) => item.value === 'All donors');
191-
192-
if (!values.length || isAllDonors) {
190+
if (!values.length) {
193191
renderDefaultChart(chart, cleanData(data), { years, channels });
194192

195193
return;
@@ -208,11 +206,11 @@ const renderFundingChannelsChart = () => {
208206
<ChartFilters selectErrorMessage={donorSelectErrorMessage}>
209207
<Select
210208
label="Select up to two donors"
211-
options={donors.map((donor) => ({ value: donor, label: donor, isCloseable: donor !== defaultDonor }))}
212-
defaultValue={[{ value: defaultDonor, label: defaultDonor, isCloseable: false }]}
209+
options={donors.map((donor) => ({ value: donor, label: donor, isCloseable: true }))}
210+
defaultValue={[{ value: defaultDonor, label: defaultDonor, isCloseable: true }]}
213211
isMulti
214212
onChange={onSelectDonor}
215-
singleSelectOptions={[{ value: defaultDonor, label: defaultDonor, isCloseable: false }]}
213+
// singleSelectOptions={[{ value: defaultDonor, label: defaultDonor, isCloseable: false }]}
216214
css={{ minWidth: '200px' }}
217215
classNamePrefix="channels-chart-select"
218216
isClearable={false}

src/components/DonorChartFilters.js

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
import React, { useEffect, useState } from 'react';
2+
import PropTypes from 'prop-types';
3+
import ChartFilters from './ChartFilters';
4+
import Select from './Select';
5+
6+
const DonorChartFilters = ({ defaultDonor, onSelectDonor, ...props }) => {
7+
const [donors, setDonors] = useState(props.donors);
8+
const [dataType, setDataType] = useState(props.defaultDataType);
9+
10+
useEffect(() => {
11+
setDonors(props.donors);
12+
}, [props.donors]);
13+
14+
const onSelectDataType = (item) => {
15+
setDataType(item ? item.value : props.defaultDataType);
16+
if (props.onSelectDataType) {
17+
props.onSelectDataType(item ? item.value : props.defaultDataType);
18+
}
19+
};
20+
21+
return (
22+
<ChartFilters selectErrorMessage={props.donorSelectErrorMessage}>
23+
<Select
24+
label="Select up to two donors"
25+
options={donors.map((donor) => ({ value: donor, label: donor, isCloseable: true }))}
26+
defaultValue={[{ value: defaultDonor, label: defaultDonor, isCloseable: true }]}
27+
isMulti
28+
onChange={onSelectDonor}
29+
css={{ minWidth: '200px' }}
30+
classNamePrefix="donors-select"
31+
isClearable={false}
32+
/>
33+
<Select
34+
label="Display data as"
35+
options={['Volumes', 'Proportions', '%GNI'].map((item) => ({ value: item, label: item }))}
36+
defaultValue={[{ value: dataType, label: dataType }]}
37+
value={dataType}
38+
onChange={onSelectDataType}
39+
css={{ minWidth: '150px' }}
40+
classNamePrefix="donors-display-data-as"
41+
/>
42+
</ChartFilters>
43+
);
44+
};
45+
46+
DonorChartFilters.propTypes = {
47+
donors: PropTypes.array,
48+
donorSelectErrorMessage: PropTypes.string,
49+
onSelectDonor: PropTypes.func,
50+
onSelectDataType: PropTypes.func,
51+
defaultDonor: PropTypes.string,
52+
defaultDataType: PropTypes.string,
53+
};
54+
55+
export default DonorChartFilters;

src/components/Select.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,6 +95,6 @@ Select.propTypes = {
9595
isClearable: PropTypes.bool,
9696
};
9797

98-
Select.defaultProps = { maxSelectedOptions: 2 };
98+
Select.defaultProps = { maxSelectedOptions: 2, singleSelectOptions: [] };
9999

100100
export default Select;

0 commit comments

Comments
 (0)