#44643: Wrap tooltip label

by notacouch

HTML

<!--
fork of:
https://jsfiddle.net/optikz09/e36ktn1p/
-->
<script type="text/javascript" src="https://drive01.atkearney.com/amcharts4/core.js"></script>
<script type="text/javascript" src="https://drive01.atkearney.com/amcharts4/charts.js"></script>
<script type="text/javascript" src="https://drive01.atkearney.com/amcharts4/themes/animated.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script>
<div id="chartdiv"></div>

CSS

@font-face {
  font-family: "Graphik Web";
  src: url("https://www.atkearney.com/o/atk-dot-com-theme/css/fonts/Graphik-Bold-Web.woff") format("woff");
}

,
@font-face {
  font-family: "Graphik Light";
  src: url("https://www.atkearney.com/o/atk-dot-com-theme/css/fonts/Graphik-Light-Web.woff") format("woff");
}

#chartdiv {
  width: 100%;
  height: 500px;
  font-family: Graphik Web;
}

JavaScript

WebFont.load({
   google: {
     families: ["Graphik Web, Graphik Light"]
   },
   active: createCharts
 });

 function createCharts() {
   // ...
 }

 // Themes begin
 am4core.useTheme(am4themes_animated);
 // Themes end

 // Create chart instance
 var chart = am4core.create("chartdiv", am4charts.XYChart);
 var label = chart.createChild(am4core.Label);

 label.text = "Bijoux spends approximately $1 billion globally on across six major indirect category groupings";
 label.fontSize = 25;
 label.fontFamily = "Graphik Web";
 label.isMeasured = false;
 label.x = 0;
 label.y = 0;

 var topContainer = chart.chartContainer.createChild(am4core.Container);
 topContainer.layout = "absolute";
 topContainer.toBack();
 topContainer.paddingBottom = 15;
 topContainer.width = am4core.percent(100);

 var subtitle = topContainer.createChild(am4core.Label);
 subtitle.text = "[#818285]Indirect Goods & Services estimated spend[/][#818285 font-family: Graphik Light]\n($ millions)[/]";
 subtitle.fontSize = 18;
 subtitle.fontFamily = "Graphik Web";
 subtitle.marginTop = 50;
 subtitle.marginBottom = 15;


 // Add data
 chart.data = [{
   category: "Store construction and occupancy",
   value: 396,
   open: 0,
   displayValue: 396,
   texttip:"“Value eingieer” building materials, Unbundle GC cost components and  aggregate volume"
 }, {
   category: "Marketing",
   value: 396 + 244,
   open: 396,
   displayValue: 244,
   texttip:"Rationalize specifications and develop “rate cards” for Print, Un-bundle Direct Mail cost components: lettershop, sorting, freight, Optimize online search fees/keywords"
 }, {
   category: "Corporate services",
   value: 396 + 244 + 158,
   open: 396 + 244,
   displayValue: 158,
   texttip:"Pursue “best in market” health plans, Develop “rate cards” for professional services – apply demand management Auction temp labor andsecurity services, Bid “city pairs” and key hotel locations"
 }, {
   category: "Information technology",
   value: 396 + 244 + 158 + 90,
  ...