chú giải công cụ tùy chỉnh trên cumulativeLineChart trong nvd3

Question

Khi tôi di chuột trên các dòng trên biểu đồ đường tích lũy, tôi nhận được một thông báo tooltip x giá trị tại một số thời gian y. Tôi muốn chỉnh sửa tin nhắn này và thêm nội dung khác.

Vì trong mảng giá trị của tôi, tôi có json chứa {X: x, Y: y, Z: z, Dt: ngày} Tôi muốn hiển thị danh sách thông báo tùy chỉnh X/Y/Z vào ngày.

Answer 1

Nếu bạn chưa tìm thấy một giải pháp thích hợp nào, ở đây bạn cố gắng này -

nv.addGraph(function() { 
    var chart = nv.models.cumulativeLineChart().x(function(d) { 
     return d[0] 
    }).y(function(d) { 
     return d[1] 
    }).color(d3.scale.category10().range()).tooltip(function(key, x, y, e, graph) { 
     return '<h3>' + key + ' Custom Text Here ' + x + '</h3> here' + '<p> or here ,' + y + '</p>' 
    }); 
}); 

Hy vọng nó giúp.

Answer 2

Tôi đang sử dụng nvd3 veraion 1.1.15b.

Calling .tooltip() không làm việc cho tôi, nhưng gọi .tooltipContent() đã, như trong đoạn mã sau:

 var chart = nv.models.pieChart() 
      .x(function (d) { return d.file; }) 
      .y(function (d) { return d.size; }) 
      .tooltipContent(function (key, y, e, graph) { 
       return '<h3>' + key + '</h3>' + 
        '<p>' + e.value.toSizeFmt() + '</p>'; 
      }) 

Như Andrei điểm ở trên, tham số e cung cấp quyền truy cập vào các giá trị nguyên, do đó bạn có thể định dạng chúng, thay vì làm việc với y đã được định dạng văn bản. Hi vọng điêu nay co ich!