顶部柱形图中的标题

问题描述 投票:0回答:1

我使用条形图在列顶部使用标题时遇到问题。在某些时刻显示标题,其他时刻不显示...

在这里我的Print

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的文档,但我找不到任何可以帮助我解决这个问题的内容。

javascript charts highcharts
1个回答
1
投票

将dataLabels.overflow更改为“justify”。

 "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/

(我也改变了颜色,因为在对比的时候我不喜欢它)

© www.soinside.com 2019 - 2024. All rights reserved.