gpt4 book ai didi

javascript - Echart条形图反转Y轴

转载 作者:行者123 更新时间:2023-12-02 15:00:21 25 4
gpt4 key购买 nike

我正在尝试使用 Echarts 创建条形图。我正在尝试反转 YAxis。我试图显示的数据将较短的时间视为较高的分数,将较高的时间视为较低的分数。目前,图形显示时间越长得分越高。我在尝试反转 YAxis 时遇到问题。任何帮助都会很棒。

<script type="text/javascript">
var dom = document.getElementById("chartPace");
var myChart = echarts.init(dom);
app.title = 'Test';

option = {
color: ["#000000"],
responsive: true,
maintainAspectRatio: false,

grid : {
height: '250',
width: '450'
},
title : {
text: 'test'
},
xAxis : [
{
type : 'category',
data : ['Mon','Tue','Wensday','Tue','Wensday'],
axisTick: {
alignWithLabel: true
},
}
],
yAxis : [
{
type : 'time',
reversed:true,
axisLabel: {
formatter: function (value) {
var value = new Date(value);
var minutes = value.getMinutes();
if (value.getSeconds().toString().length < 2){
var seconds = "0" + value.getSeconds();
}
else{
var seconds = value.getSeconds();
}
return minutes +":" + seconds;
//return value;
}
}
}
],
tooltip:{
formatter : function (params) {

var value = new Date(params['data']);
var minutes = value.getMinutes();
if (value.getSeconds().toString().length < 2){
var seconds = "0" + value.getSeconds();
}
else{
var seconds = value.getSeconds();
}
return minutes +":" + seconds;
}
},
series : [
{
name:'Avg Pace',
type:'bar',
barWidth: '60%',
data:[new Date(2014, 9, 1, 0, 2,30),
new Date(2014, 9, 1, 0, 1,05),
new Date(2014, 9, 1, 0, 2,30),
new Date(2014, 9, 1, 0, 3,20),
new Date(2014, 9, 1, 0, 1,25),
new Date(2014, 9, 1, 0, 0,00)]
}
]
};

if (option && typeof option === "object") {
myChart.setOption(option, true);
}
$(window).on('resize', function(){
if(chart != null && chart != undefined){
chart.resize();
}
});
</script>

最佳答案

您可以在 Y 轴上使用 inverse:true

关于javascript - Echart条形图反转Y轴,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50239007/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com