Javascript 当数据类型为数字时,如何对google图形X轴排序

Javascript 当数据类型为数字时,如何对google图形X轴排序,javascript,html,graph,google-visualization,Javascript,Html,Graph,Google Visualization,我有一个数据表,第一列是1到48之间的数字: Step Pct 1 0 2 0 3 0 4 35 5 45 6 55 7 60 ... 我的代码如下所示: //Grid_Table is my html table containing the data //div is my html div where the graph is painted var data = new google.visu

我有一个数据表,第一列是1到48之间的数字:

Step    Pct 
1       0
2       0
3       0
4       35
5       45
6       55
7       60
...
我的代码如下所示:

//Grid_Table is my html table containing the data
//div is my html div where the graph is painted

var data = new google.visualization.DataTable();
data.addColumn('number', 'Step');
data.addColumn('number', 'Pct');
for (var row = 1; row < Grid_Table.rows.length; row++) {

    var rowArray = [];
    for (var col = 0; col < Grid_Table.rows[row].cells.length; col++) {

        rowVal =Number(Grid_Table.rows[row].cells[col].textContent) || 0;
        rowArray.push(rowVal);
    }
    data.addRow(rowArray);
}

var options = {

    title: 'Chart',
    legend: { textStyle: { fontSize: '12' } },
    hAxis: { title: 'Step', textStyle: { fontSize: '7'}, direction: -1, slantedText: true, slantedTextAngle: '45'},
    vAxis: { title: 'Pct', textStyle: { fontSize: '12' } },
    tooltip: { textStyle: { fontSize: '12' } },
    backgroundColor: '#eaeaea',
    };

data.sort({ column: 0, asc: true });

var chart = new google.visualization.ColumnChart(div);
chart.draw(data, options);
致:

我得到了同样的结果


我想让最小的数字出现在图表的开头。如何解决此问题?

连续轴(数据类型=编号)

对于具有连续轴的图表,
hAxis
将始终按照第一列或X值的顺序绘制值

因此,在绘制图表之前对数据进行排序不会产生任何效果

有两个图表选项可用于让图表按升序或降序绘制值,仅用于轴值

您可以使用
hAxis.direction:1
-1
反转顺序

反向分类:true
false
也可用

在这种情况下,从
hAxis
中删除
direction:-1
,以获得所需的结果

离散轴(数据类型=字符串)

使用离散轴时,数据可以按照您的需要进行排序。 下面是两个示例,使用相同的数据,但类型不同

请注意,第一个图表(离散轴)上的X值顺序错误

google.load('visualization','1',{'packages':['corechart'],'callback':drawChart});
函数绘图图(){
var Grid_Table=document.getElementById(“Grid_Table”);
var div1=document.getElementById('chart_div1');
var div2=document.getElementById('chart_div2');
var data1=新的google.visualization.DataTable();
data1.addColumn('string','Step');
数据1.addColumn('number','Pct');
var data2=新的google.visualization.DataTable();
data2.addColumn('number','Step');
数据2.addColumn('number','Pct');
对于(var row=1;row

离散轴

连续轴 步 PCT 1. 0 2. 0 3. 0 4. 35 5. 45 6. 55 7. 60 8. 65 9 50 10 40
非常感谢您的支持。测试完成后我会给你回复的,像个魔咒一样!!谢谢
data.sort({ column: 0, asc: true });
data.sort({ column: 0, desc: true });