Microstrategy Sử dụng hình ảnh hóa làm biểu đồ chi phí biểu đồ D3

Question

Tôi đang cố gắng sử dụng trực quan hóa làm công cụ chọn trên biểu đồ chi phí D3. Tôi đang làm theo các tài liệu SDK Ở đây, và tôi không thể làm ví dụ của tôi làm việc.

Cơ bản tôi gắn dấu sao bằng cách khai báo "me" var và bật tùy chọn "sử dụng làm bộ lọc".

var me = this; 
this.addUseAsFilterMenuItem(); 

Sau đó, khi phụ thêm yếu tố svg de, tôi thêm các phương pháp rõ ràng và kết thúc selecion:

var g = d3.select(this.domNode).append("svg") 
    .attr("width", width + margin.left + margin.right) 
    .attr("height", height + margin.top + margin.bottom) 
    .append("g") 
    .attr("transform", "translate(" + margin.left + "," + margin.top + ")") 
    .on("click", function(d) { 
     if (event.target.classList.contains('bar')) { 
      me.clearSelections(); 
      me.endSelections(); 
      return true; 
     } else { 
      return true; 
     } 
    }); 

Khi nhận được dữ liệu tôi sử dụng thuộc tính hasSelection:

var data = this.dataInterface.getRawData(mstrmojo.models.template.DataInterface.ENUM_RAW_DATA_FORMAT.TREE, { 
    hasSelection: true 
}).children; 

Và khi thêm phương pháp "applyselection" trên thanh của tôi:

g.selectAll(".bar") 
.data(data) 
.enter() 
.append("rect") 
.attr("class", "bar") 
.attr("x", function(d) { 
    return x(d.name); 
}) 
.attr("y", function(d) { 
    return y(d.value); 
}) 
.attr("height", function(d) { 
    return height - y(d.value); 
}) 
.attr("width", x.rangeBand()) 
.style("fill", function(d) { 

}) 
.on("click", function(d) { 
    me.applySelection(d.selection); 
}); 

Nhưng nó không hoạt động. Tôi quản lý để điều khiển d.selection trên sự kiện nhấp vào thanh, tôi đã bị tách rời.

Có thể ai đó vui lòng cho tôi một bàn tay về điều này không?

Cảm ơn bạn.

Answer 1

Tôi đã có thể tìm hiểu điều gì đã xảy ra với mã của mình, sau khi dành nhiều giờ cho việc này. Phương pháp chọn phải được gọi như sau:

.on("click", function(d, i) { 
    me.applySelection(data[i].attributeSelector); 
    return true; 
});