2016-11-16 14 views
2

У меня есть диаграмма с разной высотой на основе параметра, из-за чего заголовок оси y обрезается сверху, когда высота становится меньше, чем длина заголовка.highcharts y-axis title wrap

Highchart api at http://api.highcharts.com/highcharts/yAxis.title указывает свойство стиля, в котором могут быть указаны стили CSS для заголовка, но javascript wordWrap: «break-word» здесь не работает.

Мой вопрос: есть ли какое-либо свойство, которое может обернуть заголовок оси y в таком случае?

Примечание: Я искал SO и нашел вопрос - Highcharts Y-axis title text length is more than chart's height, но это не ответит на мой случай, поскольку у меня нет статического заголовка и не может иметь тег
, чтобы заставить разрывать линию.

+0

Вы можете разместить изображение – Sajeetharan

+0

Пожалуйста, пост фрагмент кода, который вы пробовали, слово-обертывание работает в Highcharts –

+0

Вот сценарий демонстрации проблемы: http://jsfiddle.net/mxyvnb8v/4/ – shweta

ответ

1

Просто добавьте фиксированную ширину и шаг в стиле:

title: { 
       enabled: true, 
       text: 'very long title text here that will get cut off at the top when height becomes less than the length of the title', 
       style: { 
        font: 'bold 10pt "Arial Narrow"',      
        color: 'rgb(0,0,0)', 
        wordWrap:'break-word', 
     // Add these   
        width : "200px" 
       } 
      } 

ваш Fiddle updated here

+0

Нишит, используя фиксированную ширину, заставил заголовок обернуть, да, спасибо! Теперь заголовок все равно будет обернут для большего значения высоты диаграммы, чего не должно быть. Поэтому мне придется вычислять эту ширину динамически в зависимости от высоты диаграммы. Кроме того, укажите значение смещения, также динамически рассчитанное, чтобы завернутый заголовок не перекрывал метки. Что делает «шаг: 1», точно? – shweta

+0

Да, это для этикетки на самом деле и не должно быть там в стиле заголовка. Plz удаляет это. Шаг используется в ярлыках yZxis, когда у вас много ярлыков, и вы хотите пропустить их через шаг. –

+1

Наконец я добавил ширину, рассчитанную на основе высоты диаграммы, как: событий: { \t нагрузка: функция() { \t \t this.yAxis [0] .setTitle ({ \t \t \t стиль: { \t \t \t width: this.chartHeight - 100 \t \t \t} \t \t}); \t} } в событии загрузки диаграммы – shweta

 Смежные вопросы

  • Нет связанных вопросов^_^