【问题标题】:Removing inner padding from Google linechart visualization从 Google 折线图可视化中删除内部填充
【发布时间】:2012-11-25 14:48:32
【问题描述】:

有没有人知道一种方法来删除出现在内部图表区域两侧的默认填充,在这个screengrab 中以浅蓝色突出显示

这是我目前用来生成图表的代码...

google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = google.visualization.arrayToDataTable([
      [<?php echo $colTitles; ?>], 
      <?php echo $values; ?>
    ]);

    var options = {
        width: 785, height: 440,
        chartArea: {top:20,left:20,right:0,bottom:0,width:"70%",height:"80%"},
        legend: {position: 'right', textStyle: {fontSize: 10}, alignment: 'start'},
        hAxis: {
            direction:-1,
            slantedText:true,
            slantedTextAngle:90 // here you can even use 180
        },
        vAxis: {maxValue:40, minValue:0, format:'#',gridlines:{count:10}}
    };

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }

【问题讨论】:

  • +1 用于在第一时间提出一个格式良好的问题。

标签: google-visualization


【解决方案1】:

安东尼奥,

我从未见过这样的请求,并且查看 API 并没有 vAxis 选项用于在指定的某个点(像素)开始线条。

无论如何,我 jsfiddle 是一个使用 CSS 样式选项的解决方案。

基本上,我只是裁剪了图表的右侧填充部分,并将 vAxis 标题放置在其中以保留标题并在 (aprovechar el espacio) 填充空白处绘制。

Saludos!

【讨论】:

  • 感谢您的回复,兄弟,
  • 我也很难在 API 中找到任何东西来指定线条的起点/终点。我在 vAvis 中添加了 textPosition:'in' 并将图表区域的左侧填充设置为 0,这当然有帮助,但图表两侧的间距似乎仍然过大...link
  • 好吧,我只是在考虑更改图表类型以供更可定制的人使用。
猜你喜欢
  • 2016-12-08
  • 1970-01-01
  • 2020-12-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-11-26
  • 2015-03-14
  • 1970-01-01
相关资源
最近更新 更多