jeudi 25 janvier 2018

this.set() not a function when clicking D3 Pie Chart Segments

I am trying to set a 'selectedLabel' when I click on my pie chart segments for use further in my component but I running into a 'this.set() is not a function' error that I have not seen before.

This answer suggests that the object I am trying to set the property for is not an Ember object and therefore needs to be changed with Ember.set(object, 'property' value) but this returns a null error.

I am using both this.get and this.set methods elsewhere in the same component so I'm not sure if there is a problem with his specific object or if I have a scoping issue.

Code:

let g = svg.selectAll("arc")
  .data(mpie)
  .enter().append("g")
  .attr("class", "arc")

  g
  .on("mousemove", function(d) {
    var mouseVal = mouse(this);
    div
      .html("Items: " + d.data.count + "</br>" + "Date: " + d.data.label)
      .style("left", (event.pageX + 12) + "px")
      .style("top", (event.pageY - 10) + "px")
      .style("opacity", 1)
      .style("display", "block");
  })
  .on("mouseout", function() {
    div.html(" ").style("display", "none");
  })

//attempt to set 'selectedLabel' property
      .on("click", function(d) {
        this.set('selectedLabel', d.data.label)
      })

Console logging 'this' in the click function gives me the correct segment of the pie chart.




Aucun commentaire:

Enregistrer un commentaire