Заголовок в верхнем столбце диаграммы - PullRequest
0 голосов
/ 14 февраля 2019

У меня проблема с использованием заголовков в верхней части столбцов с помощью гистограммы.В некоторых моментах показывает заголовок, а в другой момент не показывает ...

Здесь мой Печать !

chart = new Highcharts.Chart({
  "chart": {
    "renderTo": "container_adwords",
    "type": "column",
    "animation": false
  },
  "title": {
    "text": "Formul\u00e1rio | Chatbot | Whatsapp)"
  },
  "colors": ["#1d6c3f", "#003f23", "#68a9dc", "#007b5a", "#e4452b", "#ba0d00", "#004b76", "#b6740c", "#1b964e", "#f79969", "#fdc076", "#24a1ae", "#e46a2b", "#ff7754", "#83ccb0", "#6ecbd6", "#ec9631", "#65c07f", "#147bb6", "#005a64"],
  "series": [{
    "name": "2018",
    "data": [575, 360.818182, 194.285714, 410.1, 212, 161.92, 344.846154, 203.639, 824.268, 130.406333, 323.399231, 657.198889]
  }, {
    "name": "2019",
    "data": [1236.88, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
  }],
  "xAxis": {
    "categories": ["Jan", "Fev", "Mar", "Abr", "Mai", "Jun", "Jul", "Ago", "Set", "Out", "Nov", "Dez"],
    "labels": {
      "style": {
        "fontSize": "15px"
      }
    }
  },
  "yAxis": {
    "min": 0,
    "title": {
      "text": "Quantidade"
    }
  },
  "legend": {
    "align": "center",
    "verticalAlign": "bottom"
  },
  "tooltip": {
    "formatter": function() {
      return '' + this.x + ': R$ ' + this.y.toFixed(2).replace('.', ',').replace(/(\d)(?=(\d{3})+\,)/g, "$1.");
    }
  },
  "plotOptions": {
    "column": {
      "dataLabels": {
        "enabled": true,
        "crop": true,
        "overflow": "none",
        "style": {
          "fontSize": "14px"
        },
        "formatter": function() {
          return 'R$ ' + this.y.toFixed(2).replace('.', ',').replace(/(\d)(?=(\d{3})+\,)/g, "$1.");
        }
      }
    }
  }
});

Я посмотрел в документации Highcharts, но яне смог найти ничего, что могло бы помочь мне в этом вопросе.

1 Ответ

0 голосов
/ 14 февраля 2019

Измените dataLabels.overflow на «оправдать».

 "plotOptions": {
    "column": {
      "dataLabels": {
        "color": "black",
        "enabled": true,
        "crop": false,
        "overflow": "justify",
        "style": {
          "fontSize": "14px"
        },
        "formatter": function() {
          return 'R$ ' + this.y.toFixed(2).replace('.', ',').replace(/(\d)(?=(\d{3})+\,)/g, "$1.");
        }
      }
    }
  }

https://jsfiddle.net/vdLtw9as/

(я также изменил цвет, потому что мне не нравится, когда есть контраст)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...