iT邦幫忙

0

[highchart] x軸自動填滿取消

  • 分享至 

  • xImage

假設我目前有6組資料

series:[Date.utc(20,10,14),....,Date.utc(20,11,14)]

預計想顯示的是這樣
https://ithelp.ithome.com.tw/upload/images/20201214/20123396ZKsUdoMJpl.png

可是當我把視窗拉大之後會變成這樣
https://ithelp.ithome.com.tw/upload/images/20201214/20123396UKQrQrnr7d.png

我發現它會自動補足x軸的空白處,請問有甚麼方法可以停掉這個功能嗎,感謝各位大大

下面附上highchart的部分 code

line:{
        xAxis: {
          ordinal: false,
          type:'datetime',
          startOfWeek: 1,
          dateTimeLabelFormats:
          this.props.timeUnit ==='glbtime_YMDH'
            ? {hour: '%Y-%m-%d-%h'}
            : this.props.timeUnit==='glbtime_YMD' 
              ? { day: '%Y-%m-%d'} 
              : this.props.timeUnit==='glbtime_WEEKNUM' 
                ? {week: '%Y-%m-%d'}
                : {month: '%Y-%m'},
          labels: {
            rotation: -30,
            style: { fontSize: '9px' }
          },
        },
}
看更多先前的討論...收起先前的討論...
powerc iT邦研究生 5 級 ‧ 2020-12-14 14:23:36 檢舉
ordinal: false改成true?
labels: {
step: "what step you want"
}
https://api.highcharts.com/highcharts/xAxis.labels.step
Chris iT邦新手 5 級 ‧ 2020-12-14 14:45:19 檢舉
我剛剛試了 沒用 QQ
Chris iT邦新手 5 級 ‧ 2020-12-14 14:46:03 檢舉
感謝 listennn08 大大 我馬上試試看
還要設定 categories 才會固定 labels
Chris iT邦新手 5 級 ‧ 2020-12-14 15:46:26 檢舉
剛剛稍微試了一下還是不太能達成我的需求,不過還是感謝大大的回答~
Chris iT邦新手 5 級 ‧ 2020-12-14 15:50:05 檢舉
主要原因是我的日期不太能以等差區別,這樣反而會漏掉一些。categories 的部分我不太清楚是要設定 type= categories 還是其他的部分,不過礙於我其他格式都是配合 datetime 做的,這樣反而會改動太大就不做了
這樣可以只設定 categories 不用設定 step
xAxis: {
categories: [Date.utc(20,10,14),....,Date.utc(20,11,14)]
}
把資料的時間取出來新增成 categories 就好
https://codepen.io/gitoxxvn/pen/oNzBmze
Chris iT邦新手 5 級 ‧ 2020-12-14 18:25:48 檢舉
後來我使用 tickPositions 解決了 感恩大大的回答 真的很有幫助!
有解決就好~~
我好像沒有幫到忙 XD
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友回答

立即登入回答