2012-06-07 14 views
9

Używam funkcji D3 each, która akceptuje funkcję zwrotną i wywołuje ją jako argument, przekazując this, ale muszę uzyskać dostęp zarówno do this i _this. Jest to kod coffeescript:Jak używać `this` i` _this` (grubej strzałki) przy użyciu coffeescript?

@x = d3.scale.ordinal().domain(d3.range(@model.geneExpressions[0].length)).rangeBands([0, width])  

getRow = (row) => 
    cell = d3.select(this).selectAll(".cell") 
     .data(row) 
     .enter().append("rect") 
     .attr("x", (d,i) => @x(i))  

rows = @heatmap.selectAll(".row") 
    .data(@model.geneExpressions) 
    .enter().append("g") 
    .each(getRow)      

i JavaScript, który generuje:

var _this = this;  

this.x = d3.scale.ordinal().domain(d3.range(this.model.geneExpressions[0].length)).rangeBands([0, width]);  

getRow = function(row) { 
     var cell; 
     return cell = d3.select(_this).selectAll(".cell").data(row).enter().append("rect").attr("x", function(d, i) { 
      return _this.x(i); 
     }) 
     };  

rows = this.heatmap.selectAll(".row").data(this.model.geneExpressions).enter().append("g").attr("class", "row").each(getRow); 

Jak mogę uzyskać coffeescript używać this zamiast w tej linii i zostawić wszystko ten sam ?:

return cell = d3.select(this) ... 

Problem polega na tym, że nie mogę przekazać @x jako argumentu do each i użyć cienkiej strzałki zamiast grubej strzałki (ponieważ wtedy nie mogłem uzyskać dostępu s @x), chyba że przepisuję funkcję D3, która wydaje się przesadna.

Odpowiedz

12

Więc trzeba tę strukturę:

@x = ... 
getRow = (row) => 
    d3.select(@)...attr('x', (d, i) => @x(i)) 
rows = ...each(getRow) 

Ale trzeba getRow być normalnym -> funkcja tak, że dostaje element DOM jako @ i trzeba attr zwrotnego być związany => funkcja tak @x działa, prawda?

dwie możliwości natychmiast przychodzą na myśl:

  1. Skorzystaj z formularza coffeescript o zwykłej JavaScript var that = this; sztuczki.
  2. Użyj wywoływanej funkcji o nazwie dla wywołania zwrotnego attr.

Pierwszy z nich wygląda mniej więcej tak:

that = @ 
getRow = (row) -> 
    cell = d3.select(@) 
     .selectAll(".cell") 
     .data(row) 
     .enter().append("rect") 
     .attr("x", (d,i) -> that.x(i))  

Drugi idzie tak:

x_at_i = (d, i) => @x(i) 
getRow = (row) -> 
    cell = d3.select(@) 
     .selectAll(".cell") 
     .data(row) 
     .enter().append("rect") 
     .attr("x", x_at_i) 
+0

Uratowałeś mnie. Dzięki! – nachocab

+0

Świetna odpowiedź mu. –

Powiązane problemy