CODEWITHSUNDEEP
javascripthtmld3.jsc3.js
MTT
MTT

Reputation: 379

c3 chart not displaying changes on axis

I am trying to display the following chart with the required options on x and y axis but changes on axis are not working. The chart is being displayed but Y axis has not the min, max attributes, position is not the one I passed... What is wrong?

<div id="chart2"></div>
            <script>
                var chart = c3.generate({
                    bindto: '#chart2',
                    data: {
                        url: "../static/CSV/Chart_data/grades_access.csv",
                        x:'AC_GRADE',
                        type: 'scatter'
                    },
                    axis: {
                        y: {
                            label: "Average grade",
                            position: "outer-middle",
                            padding: {top: 200, bottom: 0},
                            min:0,
                            max:10
                        },
                        x: {
                            label: "Access grade",
                            position: "outer-center",
                            padding: {top: 200, bottom: 0},
                            min:0,
                            max:10
                        }
                    },
                    size: {
                        height: 400,
                        width: 800
                    },
                    zoom: {
                        enabled: true
                    }     
                }); 
            </script>

Upvotes: 1

Views: 119

Answers (1)

akmed0zmey
akmed0zmey

Reputation: 573

Well, actually a lot of wrongly defined params.
1. Label position should be defined like this 

axis: {
  x: {
   label: {
    text: 'Your X Axis',
    position: 'outer-center'
   } 
 }
}

2. Padding affects on min and max so you should set it to 0 if you want.
3. Padding for x axis should use left and right properties.
Maybe something else, just check the http://c3js.org/reference.html thoroughly.

Upvotes: 1

Related Questions