简体   繁体   中英

how to customize y axis ticks in YUI charts?

I am using the following code to generate a histogram chart using YUI charts:

YUI().use('charts', function(Y) {
    //Data for the chart
    var myDataValues = barResponse.data;
    // Instantiate and render the chart
    var mychart = new Y.Chart({
        dataProvider: myDataValues,
        legend: {
            position: "right",
            width: 300,
            height: 300,
            styles: {
                hAlign: "center",
                hSpacing: 4
            }
        },
        axes: {
            category: {
                styles: {
                    label: {
                        rotation: -45
                    }
                }
            }
        },
        render: "#mychart",
        type: "column"
    });
});

where barResponse is JSON object containing the data, myChart is the html div where the chart will be plotted:

<div id="mychart"></div>

Since my data is low values like : 0.028 , 0.047 .. etc. I am getting very small bars in the chart as the y axis is defined automatically between 0 to 1. That's how it looks:

在此处输入图片说明

The question is how can i customize the ticks range of the y axis: to make it for example from 0.0 to 0.3? or in other words how to make the histogram bars bigger for the same dataset?

I checked the API documentation but it's confusing.

Set the YAHOO.widget.NumericAxis.maximum to the desired value.

The official docs specify that:

... If not set explicitly, the axis maximum will be calculated automatically.

Reference:

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM