nvd3折线图,如何去除网格线和yaxis [英] nvd3 line chart, how to remove gridlines and yaxis

查看:28
本文介绍了nvd3折线图,如何去除网格线和yaxis的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我用取景器制作了折线图.

这是我的初始代码

 var chart = nv.models.lineWithFocusChart();//chart.transitionDuration(500);图表.xAxis.tickFormat(d3.format(',g'));图表.xAxis.axisLabel("日期");chart.xAxis.tickPadding(0);chart.x2Axis.tickFormat(d3.format(',g'));图表.y轴.tickFormat(d3.format(',.2g'));chart.y2Axis.tickFormat(d3.format(',.2h'));//chart.showYAxis(false);

我想删除 y 轴标签(即我不想在 y 轴上显示数字).

我还想删除所有网格线.

有没有像 chart.yAxis.somethinghere 这样的东西来做到这一点?

谢谢

解决方案

<块引用>

删除 y 轴上的刻度

.nv-axis.nv-y .tick line {显示:无;}

<块引用><块引用>

删除 x 轴上的刻度

.nv-axis.nv-x .tick line {显示:无;}

<块引用><块引用>

删除 x 轴上的标签

.showXAxis(false)

<块引用><块引用>

删除y轴上的标签

.showYAxis(false)

<块引用><块引用>

删除所有网格线

.nv-axis .tick line {显示:无;}

I have made a line chart with view finder.

Here is my initial code

     var chart = nv.models.lineWithFocusChart();

 // chart.transitionDuration(500);
  chart.xAxis
      .tickFormat(d3.format(',g'));
  chart.xAxis
        .axisLabel("Date");
  chart.xAxis.tickPadding(0);


  chart.x2Axis
      .tickFormat(d3.format(',g'));




  chart.yAxis
      .tickFormat(d3.format(',.2g'));
  chart.y2Axis
      .tickFormat(d3.format(',.2h'));
 // chart.showYAxis(false);

I want to remove the y axis labels ( i.e. i want no number showing on the y axis).

I also want to remove all the gridlines.

is there something like chart.yAxis.somethinghere to do this?

Thanks

解决方案

To remove tick on y-axis

.nv-axis.nv-y .tick line {
        display:none;
    }

To remove tick on x axis

.nv-axis.nv-x .tick line {
        display:none;
    }

To remove label on x axis

.showXAxis(false)

To remove label on y axis

.showYAxis(false)

To remove all the grid lines

.nv-axis .tick line {
        display:none;
    }

这篇关于nvd3折线图,如何去除网格线和yaxis的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆