Как мне установить заполнение в Xaxis Highstocks

#javascript #highcharts

#javascript #графики

Вопрос:

введите описание изображения здесь

У меня проблема! Как показано на рисунке, я пытаюсь установить «maxPadding» в xAxis (свойства объекта highstocks) , но я нахожу, что это невозможно, потому что вы не можете сделать это в highstocks, только в highcharts ~~~ Вы можете мне помочь? Спасибо

введите описание изображения здесь

Как сделать что-то вроде этой картинки? какие свойства я могу

Ответ №1:

Вы можете использовать xAxis.overscroll , которые добавляют дополнительный диапазон с правой стороны оси. Обратите внимание, это значение задается в миллисекундах отдельно для chart.xAxis и naviagtor.xAxis .

Код:

 Highcharts.stockChart('container', {
  title: {
    text: 'AAPL Stock Price'
  },
  xAxis: {
  	overscroll: 500000000
  },
  navigator: {
    xAxis: {
      overscroll: 500000000
    }
  },
  series: [{
    name: 'AAPL',
    data: [
      [1539264600000, 214.45],
      [1539351000000, 222.11],
      [1539610200000, 217.36],
      [1539696600000, 222.15],
      [1539783000000, 221.19],
      [1539869400000, 216.02],
      [1539955800000, 219.31],
      [1540215000000, 220.65],
      [1540301400000, 222.73],
      [1540387800000, 215.09],
      [1540474200000, 219.8],
      [1540560600000, 216.3],
      [1540819800000, 212.24],
      [1540906200000, 213.3],
      [1540992600000, 218.86],
      [1541079000000, 222.22],
      [1541165400000, 207.48],
      [1541428200000, 201.59],
      [1541514600000, 203.77],
      [1541601000000, 209.95],
      [1541687400000, 208.49],
      [1541773800000, 204.47],
      [1542033000000, 194.17],
      [1542119400000, 192.23],
      [1542205800000, 186.8]
    ]
  }]
});  
 <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>
<script src="https://code.highcharts.com/stock/modules/export-data.js"></script>

<div id="container" style="height: 400px; min-width: 310px"></div>  

ДЕМОНСТРАЦИЯ:

Ссылка на API:

Комментарии:

1. Спасибо, это решает проблему для представления, но как синхронизировать данные с представлением?

2. Что вы имеете в виду под этим? Не могли бы вы выразиться точнее?

3. хорошо, я хочу, чтобы моя ось x также имела «правильное заполнение», потому что теперь только представление имеет «правильное заполнение», а ось x — нет.

4. Итак, вы не хотите, чтобы метки на оси x, где на графике есть пустое пространство?

5. Я хочу, чтобы ось x также была пробелом, как представления. Чтобы ось X соответствовала оси Y.