Responsive Font Size – IndexLabelFontSize

• May 3, 2018 at 1:09 pm #20558
  
  Ryan

  Is there a way that font size can be change responsively when browser window is adjusted.
  Currently indexLabelFontSize is set to be 36;
  When chart changes in size, the font size stays the same.

  Please see the jsfiddle provided.
  https://jsfiddle.net/QwZuf/1171/

  May 3, 2018 at 2:19 pm #20570
  
  Vishwas R

  Ryan,

  Font size remains the same even after resize as you are setting indexLabelFontSize to 36. You can change indexLabelFontSize on resize of window and relate it to chart-container width and can have minimum and maximum limits on the same.

  Kindly take a look at the code-snippet below,

  $(window).resize(function() {
  		
      for(var i = 0; i < chart.options.data.length; i++){
  	chart.options.data[i].indexLabelFontSize = Math.min(36, Math.max( 12, $("#chartContainer").width() / 10));  
      }
      chart.render();
  }); 

  Please take a look at this updated jsfiddle.

  

  —
  Vishwas R
  Team CanvasJS