{"action":"created","issue":{"url":"https://api.github.com/repos/rrag/react-stockcharts/issues/121","repository_url":"https://api.github.com/repos/rrag/react-stockcharts","labels_url":"https://api.github.com/repos/rrag/react-stockcharts/issues/121/labels{/name}","comments_url":"https://api.github.com/repos/rrag/react-stockcharts/issues/121/comments","events_url":"https://api.github.com/repos/rrag/react-stockcharts/issues/121/events","html_url":"https://github.com/rrag/react-stockcharts/issues/121","id":172322920,"number":121,"title":"Using getInitialState()","user":{"login":"criles25","id":6254912,"avatar_url":"https://avatars.githubusercontent.com/u/6254912?v=3","gravatar_id":"","url":"https://api.github.com/users/criles25","html_url":"https://github.com/criles25","followers_url":"https://api.github.com/users/criles25/followers","following_url":"https://api.github.com/users/criles25/following{/other_user}","gists_url":"https://api.github.com/users/criles25/gists{/gist_id}","starred_url":"https://api.github.com/users/criles25/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/criles25/subscriptions","organizations_url":"https://api.github.com/users/criles25/orgs","repos_url":"https://api.github.com/users/criles25/repos","events_url":"https://api.github.com/users/criles25/events{/privacy}","received_events_url":"https://api.github.com/users/criles25/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2016-08-21T14:13:59Z","updated_at":"2016-08-22T02:15:39Z","closed_at":"2016-08-22T02:15:39Z","body":"I'm trying to use the `CandleStickChart.jsx`  (https://github.com/rrag/react-stockcharts/blob/master/docs/lib/charts/CandleStickChart.jsx) inside my component, but I am getting error messages. Here is my component:\r\n\r\n```\r\nimport React, { Component } from 'react';\r\nimport Chart from './CandleStickChart';\r\n\r\nexport default React.createClass({\r\n\tgetInitialState: function() {\r\n\t\treturn {\r\n\t\t\tname: '',\r\n\t\t\tchartData: [{date: new Date(), open: 1, high: 1, low: 1, close: 1, volume: 1, adjclose: undefined}],\r\n\t\t\tchartWidth: 400,\r\n\t\t\tchartType: 'svg'\t\r\n\t\t}\r\n\t},\r\n\r\n\tcomponentDidMount: function() {\r\n\t\tconsole.log(this.props.params.stockname);\r\n\t\tthis.serverRequest = $.get('/api/v1/stock/info/' + this.props.params.stockname, function(res) {\r\n\t\t\tconsole.log(res);\r\n\t\t\tvar data = JSON.parse(res.result);\r\n\t\t\tconsole.log(data);\r\n\t\t\tthis.setState({\r\n\t\t\t\tname: data.name\r\n\t\t\t});\r\n\t\t}.bind(this));\r\n\t\t// this.serverRequest2 = $.get('/api/v1/chart_info/get/' + this.props.params.stockname, function(res) {\r\n\r\n\t\t// }.bind(this));\r\n\r\n\t\tvar parseDate = d3.time.format(\"%Y-%m-%d %H:%M:%S\").parse;\r\n\t\td3[\"tsv\"](\"//rrag.github.io/react-stockcharts/data/MSFT.tsv\", (err, data) => {\r\n\t\t\t/* change MSFT.tsv to MSFT_full.tsv above to see how this works with lots of data points */\r\n\t\t\tconsole.log(data);\r\n\t\t\tdata.forEach((d, i) => {\r\n\t\t\t\td.date = new Date(d3.time.format(\"%Y-%m-%d\").parse(d.date).getTime());\r\n\t\t\t\td.open = +d.open;\r\n\t\t\t\td.high = +d.high;\r\n\t\t\t\td.low = +d.low;\r\n\t\t\t\td.close = +d.close;\r\n\t\t\t\td.volume = +d.volume;\r\n\t\t\t\t// console.log(d);\r\n\t\t\t});\r\n\t\t\tthis.setState({\r\n\t\t\t\tchartData: data\r\n\t\t\t});\t\r\n\t\t});\r\n\t},\r\n\r\n\tcomponentWillUnmount: function() {\r\n\t\tthis.serverRequest.abort();\r\n\t},\r\n\r\n\trender: function() {\r\n\t\treturn (\r\n\t\t\t<div>\r\n\t\t\t\t<h2>{this.props.params.stockname}</h2>\r\n\t\t\t\t<h4>{this.state.name}</h4>\r\n\t\t\t\t<Chart data={this.state.chartData} width={this.state.chartWidth} type={this.state.chartType} />\r\n\t\t\t</div>\r\n\t\t)\r\n\t}\r\n})\r\n```\r\n\r\nThe error messages in my console:\r\n```\r\napp.js:24223 Error: <line> attribute x1: Expected length, \"NaN\".\r\napp.js:24223 Error: <line> attribute x2: Expected length, \"NaN\".\r\n```\r\nIs trying to use `getInitialState()` the best approach, or should I do something different before rendering the chart? I apologize if this has been answered before, I couldn't find it in the issue history."},"comment":{"url":"https://api.github.com/repos/rrag/react-stockcharts/issues/comments/241300898","html_url":"https://github.com/rrag/react-stockcharts/issues/121#issuecomment-241300898","issue_url":"https://api.github.com/repos/rrag/react-stockcharts/issues/121","id":241300898,"user":{"login":"criles25","id":6254912,"avatar_url":"https://avatars.githubusercontent.com/u/6254912?v=3","gravatar_id":"","url":"https://api.github.com/users/criles25","html_url":"https://github.com/criles25","followers_url":"https://api.github.com/users/criles25/followers","following_url":"https://api.github.com/users/criles25/following{/other_user}","gists_url":"https://api.github.com/users/criles25/gists{/gist_id}","starred_url":"https://api.github.com/users/criles25/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/criles25/subscriptions","organizations_url":"https://api.github.com/users/criles25/orgs","repos_url":"https://api.github.com/users/criles25/repos","events_url":"https://api.github.com/users/criles25/events{/privacy}","received_events_url":"https://api.github.com/users/criles25/received_events","type":"User","site_admin":false},"created_at":"2016-08-22T02:15:39Z","updated_at":"2016-08-22T02:15:39Z","body":"Awesome, thanks!"}}
{"actor":{"display_login":"criles25"}}