reactjs / react-chartjs

common react charting components using chart.js
MIT License
2.93k stars 301 forks source link

Documentation enhancement #147

Closed r0fls closed 7 years ago

r0fls commented 7 years ago

Would it be possible to update the examples in the documentation with an example of some of the options? I passed in the following data from the chart.js linechart example, and the graph style is completely different:

var data = { 
  labels: ["January", "February", "March", "April", "May", "June", "July"],
  datasets: [
    {   
      label: "My First dataset",
      fill: false,
      lineTension: 0.1,
      backgroundColor: "rgba(75,192,192,0.4)",
      borderColor: "rgba(75,192,192,1)",
      borderCapStyle: 'butt',
      borderDash: [], 
      borderDashOffset: 0.0,
      borderJoinStyle: 'miter',
      pointBorderColor: "rgba(75,192,192,1)",
      pointBackgroundColor: "#fff",
      pointBorderWidth: 1,
      pointHoverRadius: 5,
      pointHoverBackgroundColor: "rgba(75,192,192,1)",
      pointHoverBorderColor: "rgba(220,220,220,1)",
      pointHoverBorderWidth: 2,
      pointRadius: 1,
      pointHitRadius: 10, 
      data: [65, 59, 80, 81, 56, 55, 40],
      spanGaps: false,
    }   
  ]
};
var MyComponent = React.createClass({
    render: function() {
          return <LineChart data={data} options={null} width="600" height="250"/>
          }   
});

Should I pass in the style data from datasets to options instead?

r0fls commented 7 years ago

Looks like my issue was actually the same as: https://github.com/reactjs/react-chartjs/issues/134