c3.js cách xóa đường bằng chú giải công cụ?

Question

Tôi đang tạo biểu đồ dạng đường bằng cách sử dụng c3.js. Tôi muốn xóa đường chỉ báo mặc định thành trục x bằng chú giải công cụ.

Tôi đã thử định dạng chú giải công cụ nhưng dòng vẫn giữ nguyên.

Cách thực hiện việc này?

Answer 1

Chỉ cần ghi đè thuộc tính css sau trong lớp .c3-xgrid lấy nét: -

.c3-grid .c3-xgrid-focus { visibility : hidden !important; }

tôi có thể không nhanh chóng tìm thấy một tham số cấu hình để tắt tính năng này trong doc api.

Answer 2

point: { 
show: false 
}, 

False để ẩn các điểm và đúng đối với chương trình điểm

Lưu ý: Hãy chắc chắn rằng bạn đang đi để viết những dòng này sau khi tải dữ liệu và cùng với các cài đặt khác in c3 Chức năng tạo ra

Đây là ví dụ: http://c3js.org/reference.html#point-show

Trong mã dưới đây tôi đã nêu bật mã với một lời nhận xét:

var chart = c3.generate({ 
    bindto: '#CYCLE_CHART', 
    data: { 
    columns: [ 
     ["Cycletime"].concat(objCycle.cData), ["Downtime"].concat(objDowntime.dData), ["StdCycletime"].concat(objStdCycle.stdCData), ["StdLoadunloadtime"].concat(objStdLUtime.stdLUData), 
    ], 
    type: 'spline', 
    types: { 
     Cycletime: 'bar', 
     Downtime: 'bar' 
    }, 
    names: { 
     Cycletime: 'Cycle time', 
     Downtime: 'Load time', 
     StdCycletime: 'Std Cycle time', 
     StdLoadunloadtime: 'Std Load time' 

    }, 
    }, 
    axis: { 
    x: { 
     label: { 
     text: 'Cycles', 
     position: 'outer-center' 
     }, 
     max: 10, 
     min: 1, 
    }, 
    y: { 
     label: { 
     text: 'Seconds', 
     position: 'outer-middle' 
     }, 
     max: Y_axis, 
     min: 1, 
    } 
    }, 

    // Here! 
    point: { 
    show: false 
    }, 

    tooltip: { 
    show: true 
    } 
}); 

Answer 3

grid:{ 
    focus:{ 
    show:false 
    } 
} 

Có thể tại thời điểm đó khi người trả lời này tham số cấu hình câu hỏi không được cung cấp nhưng bây giờ bạn có thể làm điều đó thông qua trên cấu hình đề cập đến. Tham khảo http://c3js.org/reference.html#grid-focus-show

Ví dụ mã dưới đây

var chart = c3.generate({ 
    data: { 
     columns: [ 
      ['data1', 30, 200, 100, 400, 150, 250], 
      ['data2', 50, 20, 10, 40, 15, 25] 
     ] 
    }, 
    grid:{ 
     focus:{ 
     show:false 
     } 
    } 
}); 

Answer 4

Theo BonifatiusK's bình luận, bạn nên ẩn chúng bằng cách chỉnh sửa chartOptions.

{ 
    tooltip: { 
     show: false 
    } 
} 

Thuộc tính CSS ghi đè của c3 không phải là ý hay.