okfn-brasil / mosaico

Visualization on the brazilian budget for FGV
GNU Affero General Public License v3.0
5 stars 0 forks source link

Don't show labels on the treemap that don't fit on their nodes #44

Open vitorbaptista opened 10 years ago

vitorbaptista commented 10 years ago

The problem is that the logic for showing/hiding labels is pretty simple: if the node has more than 3% of the total, show the label.

// https://github.com/openspending/openspendingjs/blob/master/widgets/treemap/main.js#L28
createLabel: function(widget, domElement, node) {
  if ((node.data.value/self.total)>0.03) {
    domElement.innerHTML = "<div class='desc'><div class='amount'>" + OpenSpending.Utils.formatAmountWithCommas(node.data.value,0,self.currency) + "</div><div class='lbl'>" + node.name + "</div></div>";
  }
},

This doesn't considers the size of the node's label. Ideally, we would calculate the size of the text (with node's label + its values), and check if it fits inside the rectangle. This makes it much more complicated, as we'll have to consider the text size in the font its being show into, which might be impossible as it's overridable using CSS.