如何在堆积柱形图谷歌图表中删除白色边框



我想删除堆积柱形谷歌图表中的白色边框。有人可以帮助我吗?

这就是我的意思:我当前的图表

使用'style'列角色删除白色边框

要实际删除它,您可以使用...

stroke-width: 0;

stroke-color: transparent;

但这将允许背景颜色显示出来,
并且在白色背景上看起来相同


相反,建议使用与每个系列相同的stroke-color

请参阅以下工作片段,DataView用于添加两个'style'

google.charts.load('current', {
  callback: drawChart,
  packages:['corechart']
});
function drawChart() {
  var seriesColors = ['#0097A7', '#26C6DA'];
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'x');
  data.addColumn('number', 'y1');
  data.addColumn('number', 'y2');
  data.addRows([
      ['Jan', 10500000, 1500000],
      ['Feb', 4500000, 400000],
      ['Mar', 7000000,800000],
  ]);
  var view = new google.visualization.DataView(data);
  view.setColumns([0, 1, {
      type: 'string',
      role: 'style',
      calc: function (dt, row) {
        return 'stroke-color: ' + seriesColors[0];
      }
    }, 2, {
      type: 'string',
      role: 'style',
      calc: function (dt, row) {
        return 'stroke-color: ' + seriesColors[1];
      }
    }
  ]);
  var options = {
    colors: seriesColors,
    height: 400,
    isStacked: true,
    legend: 'none',
    width: 400
  };
  var container = document.getElementById('chart_div');
  var chart = new google.visualization.ColumnChart(container);
  chart.draw(view, options);
};
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>

最新更新