изменить свойство legend.y на браузере изменить размер

Question

мы используем highchart control с Angular и bootstrap. Для регулировки вертикального пространства между таблицей и легенды (оба оказываемая highchart в SVG элементов), мы устанавливаем y свойство legend на странице загрузки (в controller), как это:

$scope.chartContracts = { 
    options: { 
     chart: { 
      type: 'pie', 
      marginBottom: 50 
     }, 
     legend : { 
      layout: 'horizontal', 
      align: 'center', 
      verticalAlign: 'bottom', 
      x: 0, 
      y: 4, 

сейчас в одном из макетов Bootstraps интервал (y) должен быть -10 вместо 4, потому что по некоторым причинам добавляется дополнительный интервал.

Значит, это должно быть основано на запросе на медиа или что-то подобное, я думаю?

Вопрос в том, как это сделать ... Я попытался с помощью css, но я не могу представить стиль SVG-элементов (их называют <g>)?

Answer 1

Вы можете проверить ширину окна и затем вернуть правильное значение.

var wWidth = $(window).width(), 
    value; 

if(wWidth < 400) { 
    value = 5; 
} else { 
    value = 10; 
} 

// Сфера

y: value