Chiều rộng thanh quá lớn trong jqplot

Question

Tôi mới sử dụng jqplot, khi tôi muốn vẽ biểu đồ thanh, trục x là ngày, khoảng thời gian là 1 ngày. Đây là một phần của mã của tôi:

 axesDefaults:{                 
      tickRenderer: $.jqplot.CanvasAxisTickRenderer,        
     tickOptions:{ 
      fontSize:'10pt', 
     },                   
    },                    
    axes:{                   
     xaxis:{ 
      renderer:$x_renderer,             
      tickOptions:{ 
       formatString:'%Y-%#m-%#d',           
      }, 
      rendererOptions:{              
       tickOptions:{ 
        angle:-90,              
       }                 
       },                  
      label:'$label', 
      tickInterval:'86400000', 
     }, 
     yaxis:{                  
      tickOptions:{ 
       formatString:'%.2f',             
      },                  
      autoscale:true               
     }, 
    },                    
    highlighter:{ 
     show:true,                 
    }, 

Nhưng tôi thấy chiều rộng của mỗi thanh quá lớn để che lẫn nhau. Làm thế nào để sửa chữa nó?

Cảm ơn!

Answer 1

Các AnthonyLeGovic Câu trả lời là thực sự đúng, nhưng nếu bạn cần thay đổi độ rộng cột theo số lượng các điểm dữ liệu bạn có thể làm như sau:

// Get the size of the container of the plot 
var width = jQuery(containerName).width(); 

// Divide by the number of data points. 
width = width/number_of_data_points; 

// Reduce the width to a % of the total for each data point. 
width = (width * 20)/100; 

// Set the value 
$.jqplot(containerName, [data], 
{ 
    // whatever 
    // ... 

    seriesDefault: 
    { 
     renderer: $.jqplot.BarRenderer, 
     rendererOptions: { barWidth: width } 
    } 

    // whatever 
    // ... 
} 

Lưu ý rằng tôi không tính đến chiều rộng của chú giải. Chiều rộng chú thích chỉ có thể thu được sau khi vẽ đồ thị, vì vậy nếu bạn muốn giảm chiều rộng cột xem xét ngay cả chiều rộng của chú giải, bạn phải thực hiện nó sau khi vẽ và sau đó thay thế.

Tôi đã chuẩn bị một fiddle hiển thị ví dụ.

Hy vọng điều đó sẽ hữu ích.

Answer 2

Bạn có thể xác định nó trong các tùy chọn hàng loạt của bạn:

seriesDefault:{ 
    renderer: $.jqplot.BarRenderer, 
    rendererOptions: { 
     barWidth: 5 
    } 
} 

Đừng quên bao gồm plugin barRenderer. Để biết thêm các tài liệu về biểu đồ thanh trên jqplot xin hãy xem tại địa chỉ: Jqplot documentation

Answer 3

Tôi đã thêm mã bên dưới và tôi nhận được kết quả. Lý do đằng sau chiều rộng của tôi quá lớn vì thanh chiều rộng không được đặt trong chuỗi Mặc định.

seriesDefault:{ 
    renderer: $.jqplot.BarRenderer, 
    rendererOptions: { 
      barWidth: 5 
    } 
} 

Nhờ: AnthonyLeGovic