1 files changed, 150 insertions, 0 deletions
diff --git a/client/chart/pie.charts.js b/client/chart/pie.charts.js
new file mode 100644
index 00000000..47f7756c
--- /dev/null
+++ b/client/chart/pie.charts.js
@@ -0,0 +1,150 @@
+import React, { Component } from 'react'
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
+import { toArray, toTuples } from '../util'
+import C3Chart from 'react-c3js'
+import 'c3/c3.css'
+import './chart.css'
+
+import {
+  rainbow, colorblindSafeRainbow,
+  topCountryCount, otherCountriesLabel,
+  institutionOrder, institutionLabels, institutionColors,
+  initialInstitutionLookup,
+} from './constants'
+
+class PieCharts extends Component {
+  render() {
+    const { payload } = this.props
+    const { paper, citations } = payload.data
+    if (!citations.length) return null
+    const countries = {}
+    const institutionTypes = { ...initialInstitutionLookup }
+    citations.forEach(citation => {
+      citation.addresses.forEach(address => {
+        const { country } = address
+        if (!country) return
+        if (!(country in countries)) {
+          countries[country] = 1
+        } else {
+          countries[country] += 1
+        }
+        switch (address.type) {
+          case 'company':
+          case 'edu':
+          case 'gov':
+            institutionTypes[address.type] += 1
+            break
+          case 'mil':
+            institutionTypes['gov'] += 1
+            break
+          default:
+            console.log('weird institution type', address)
+            break
+        }
+      })
+    })
+
+    const countryTuples = toTuples(countries).sort((a,b) => b[1] - a[1])
+    let countryRows = countryTuples.slice(0, 9)
+
+    const otherCountryCount = countryTuples.slice(9).reduce((a,b) => (a + b[1]), 0)
+    if (otherCountryCount > 0) {
+      countryRows.push([
+        otherCountriesLabel,
+        otherCountryCount,
+      ])
+    }
+    console.log(countryTuples, otherCountryCount, countryRows)
+
+    const institutionRows = toTuples(institutionTypes)
+      .map(a => [institutionOrder[a[0]], a])
+      .sort((a,b) => a[0] - b[0])
+      .map(a => a[1])
+      .map(a => [institutionLabels[a[0]], a[1]])
+
+    const colorPattern = rainbow
+
+    return (
+      <div className='chart'>
+        <div>
+          <C3Chart
+            data={{
+              columns: countryRows,
+              type: 'pie',
+            }}
+            color={{
+              pattern: rainbow,
+            }}
+            tooltip={{
+              format: {
+                value: value => value,
+              }
+            }}
+            size={{
+              height: 336,
+            }}
+          />
+        </div>
+        <div>
+          <C3Chart
+            data={{
+              columns: institutionRows,
+              type: 'pie',
+            }}
+            color={{
+              pattern: institutionColors,
+            }}
+            tooltip={{
+              format: {
+                value: value => value,
+              }
+            }}
+            size={{
+              height: 316,
+            }}
+          />
+        </div>
+      </div>
+    )
+  }
+}
+
+/*
+          legend={{
+            position: 'right'
+          }}
+          tooltip={{
+            contents: function (d, defaultTitleFormat, defaultValueFormat, color) {
+              const countriesByYearLookup = years[yearList[d[0].x]]
+              let countriesByYear = Object.keys(countriesByYearLookup).map(country => [country, countriesByYearLookup[country]]).sort((a,b) => b[1] - a[1])
+              let topCountriesForThisYear = countriesByYear.slice(0, topCountryCount)
+              let bottomTotal = countriesByYear.slice(topCountryCount).reduce((a,b) => (a + b[1]), 0)
+              // console.log(topCountriesForThisYear)
+              topCountriesForThisYear.push([otherCountriesLabel, bottomTotal])
+              const tableRows = topCountriesForThisYear.filter(pair => !!pair[1]).map(([country, total]) => {
+                let colorIndex = topCountries.indexOf(country)
+                if (colorIndex < 0) colorIndex = colorPattern.length - 1
+                const color = colorPattern[ colorIndex ]
+                return [
+                  "<tr>",
+                  "<td>",
+                    "<span style='background-color:" + color + "' class='swatch'></span>",
+                    country,
+                  "</td>",
+                  "<td>",
+                    total,
+                  "</td>",
+                  "</tr>",
+                ].join('')
+              })
+              return [
+                "<table class='c3-tooltip'>",
+                ...tableRows,
+                "</table>",
+              ].join('')
+            }
+          }}
+*/
+
+export default PieCharts