Как добавить стили в организационные диаграммы Google, используя angularjs?

Question

Я пытаюсь реализовать организационную диаграмму с помощью API Google Maps.В настоящее время я испытываю трудности в разработке организационной структуры.

Текущая диаграмма: https://imgur.com/tLLcP6u

Я хочу получить что-то вроде этого: https://imgur.com/cOefqb9

Пока мне удалось получить данные для отображения.

html div: <div> <div google-chart chart="orgChartObj" class="global-main-back-div" style="padding-bottom:15px;" id="chart_div"></div> </div>

Контроллер:

##The data structure
$scope.orgChartObj = {
  "type": "OrgChart",
//   "displayed": false,
  "data": {
    "cols" : [
          {"label": "id", "pattern": "", "type": "string"},
          {"label": "manager", "pattern": "", "type": "string"}
      ],
    "rows" : []
  },
  "formatters": {},
  "view": {}
}; 

//Users Data
$scope.users = [
{_id: "5c7e8cdf3d3e7ddc5f4ceadd", fullName: "T01"}

];
$scope.getLMs = function(){

    $scope.users.forEach(function(user){

        var row = {"c": [
                      {"v": "", "f": ""},
                      {"v": ""}
                  ]};
        row.c[0].v = user._id;
        row.c[0].f = user.fullName  +"<div style='color:red; font-style:italic'>Vice President</div>";

        $scope.orgChartObj.data.rows.push(row);



    });
};

Answer 1

В структуру данных диаграммы я добавил

**'allowHtml': true** property 


$scope.orgChartObj = {
  "type": "OrgChart",
//   "displayed": false,
  "data": {
    "cols" : [
          {"label": "id", "pattern": "", "type": "string"},
          {"label": "manager", "pattern": "", "type": "string"}
      ],
    "rows" : []
  },
  "formatters": {},
  "view": {},
  "options": {
       'allowHtml': true
 }
};