jckr/example-react-app

This repo is to support my tutorial on using visualization with react

Hello. 👋

This is a GitHub profile. There's content here.

Overview

A collection of repositories and code exists below. There are several languages, tools, and more.

Technologies

Languages and tools are used here. Specifics exist.

Additional Data Points

GitHub offers metrics and stats. Some might be viewed here.

Contact

Connections can be made through appropriate channels.

---

Thank you for visiting.

None of this has been written by an AI. All human-made. Thank you.

example-react-app's Issues

issue with the data in the csv() XHR function

Hey Jerome

Great series. I'm following along and I'm hitting a bit of a roadblock with the csv() function. My componentWillMount looks exactly like yours:

    csv('./data/birthdeathrates.csv', (error, data) => {
      if (error) {
        this.setState({ loadError: true })
      }

      this.setState({
        data: data.map(d => ({ ...d, x: Number(d.birth), y: Number(d.death)}))
      })
    })

But instead of returning the data, it seems to be returning the very page that this JS runs on. If I move this csv() function to the render() block and console log each of the data iterations, I get the following console output:

My directory structure is like yours too:

./src/App.js
./data/birthdeathrates.csv

My package.json file has locked the following lib versions but I can't find any obvious changes in those that would cause this:

{
  "devDependencies": {
    "react-scripts": "0.7.0",
    "react-addons-shallow-compare": ">=0.14.0"
  },
  "dependencies": {
    "d3-request": "^1.0.2",
    "react": "^15.3.2",
    "react-dom": "^15.3.2",
    "react-vis": "^0.6.5"
  }
  ...
}

I'm just thinking out loud while I try debug this, in case anyone else following this tutorial runs into the same problem. If/when I figure this out, I'll provide the solution to this issue.

NAN for cx

I am new to React and javascript, and this is the one of the best data analysis tutorials I have found. However, I am getting a data error for all my data values. I copied and pasted the relevant code from your repository. Any thoughts? Thank you.
From my console: