重绘图表网格线消失后

我正在使用jqplot图表库在我的应用程序中绘制条形图。我已经使用下面的代码来绘制水平条形图。重绘图表网格线消失后

var plot = $.jqplot('chart', [dataSlices], { 
       seriesDefaults: { 
        shadow: false, 
        renderer: $.jqplot.BarRenderer, 
        pointLabels: { show: true, location: 'e', edgeTolerance: -55 }, 
        rendererOptions: { 
         barDirection: 'horizontal', 
         barMargin: 5, 
         highlightMouseOver: false, 
         fillToZero: true 
        } 
       }, 
       axesDefaults: { 

       }, 
       axes: { 
        grid: { 
         drawBorder: false 
        }, 
        xaxis: { 
         pad: 0, 
         tickOptions: { 
          show: true, 
          mark: 'cross', 
          thousandsSeparator: ',', 
          formatString: "%d" 
         }, 
         numberTicks: null, 
         min: null, 
         max: null, 
         showTickMarks: true 
        }, 
        yaxis: { 
         renderer: $.jqplot.CategoryAxisRenderer, 
         ticks: yAxisLabels, 
         tickOptions: { 
          showMark: false, 
          showGridline: false 
         } 
        } 
       }, 
       grid: { 
        gridLineColor: '#ffffff', /**/ 
        borderColor: '#509790', 
        background: 'rgba(0,0,0,0)', 
        shadowWidth: 0, 
        borderWidth: 0, 
        shadow: false 
       }, 
       series: [{ color: '#f39f02' }] 
      }); 

      $.jqplot.thousandsSeparator = ','; 
      //$.jqplot.formatString = "%'d"; 
      gridCanvas = $($('.jqplot-grid-canvas')[0]) 
      seriesCanvas = $($('.jqplot-series-canvas')[0]) 
      gridCanvas.detach(); 
      seriesCanvas.after(gridCanvas); 
      plot.replot({ resetAxes: true });

我得到没有网格线的图表。有什么想法，如何做到这一点？

来源

2013-08-12 user2583819

GridLineColor设置为白色（#FFFFFF）解释了为什么你不看垂直线。 BorderWidth设置为0解释了为什么你没有看到你的情节的边界。 – AnthonyLeGovic

呼叫重绘后，下面几行，你会得到预期的结果

   gridCanvas = $($(item + ' .jqplot-grid-canvas')[0]) 
       seriesCanvas = $($(item + ' .jqplot-series-canvas')[0]) 
       gridCanvas.detach(); 
       seriesCanvas.after(gridCanvas);

我想它的工作对我来说罚款，。

来源

2013-11-20 06:00:03

将GridLineColor设置为白色（#FFFFFF）可以解释为什么您没有绘制垂直线条。

边框宽度设置为0，解释了为什么你不看你的情节的边界（画有大小0像素）的

如果您不需要网格的特定颜色和/或尺寸（纵线，边框）删除网格部分代码。如果您需要特定颜色和/或尺寸（如果你的背景，如果已经白色#FFFFFF - 或0像素的边框宽度）谨慎选择你的价值观：

grid: { 
gridLineColor: '#FF0000', 
borderColor: '#509790', 
background: 'rgba(0,0,0,0)', 
shadowWidth: 0, 
borderWidth: 2, 
shadow: false 
},

请参阅工作示例here（我已经删除yAxisLabels并添加为了虚构的数据绘制曲线）

来源

2013-08-12 14:03:04 AnthonyLeGovic

感谢您的回复。实际问题是在x轴中的网格线： xaxis：{pad：0，tickOptions：{show：true，mark：'cross'， thousandsSeparator：'，'，formatString：“％d”，showGridline：真}，numberTicks：空，分钟：空，最大：空，showTickMarks：真正}，网格线消失，只要做重绘。请在这里找到图片： http://sdrv.ms/19f1xWR，＃1第一个图像而不重新绘图功能x轴网格线。＃2第二图像是具有x轴网格线不重制。[这是预期的输出） – user2583819

重绘图表网格线消失后

回答

相关问题