var canvas = d3.select("body").append("canvas")
  .style("display", "none");

export function makeSprite(text, color) {
  var textHeight = 200;

  var context = canvas.node().getContext("2d");
  context.font = "bold " + textHeight + "pt Arial";

  var textWidth = context.measureText(text).width;

  var pad = textHeight * 0.25; // aovids cut-off g, j, y, etc.
  canvas.attr({width: textWidth + pad, height: textHeight + pad});

  context.font = "bold " + textHeight + "pt Arial";
  context.textAlign    = "center";
  context.textBaseline = "middle";
  context.fillStyle    = color;
  context.fillText(text, textWidth / 2, textHeight / 2);

  var url = canvas.node().toDataURL();
  var texture = THREE.ImageUtils.loadTexture(url);

  return {
    map: texture,
    width: textWidth,
    height: textHeight
  };
}
@@ -71,16 +71,33 @@
 one%22);%0A%0A
+var cache = %7B%7D;%0A%0A
 export f
@@ -126,16 +126,24 @@
 t, color
+, points
 ) %7B%0A  va
@@ -152,28 +152,120 @@
 text
-Height = 200;%0A%0A  var
+ure, context, textWidth;%0A%0A  var pad = points * 0.5;%0A  var key = text + color + points;%0A%0A  if (!cache%5Bkey%5D) %7B%0A   
  con
@@ -303,16 +303,18 @@
 (%222d%22);%0A
+  
   contex
@@ -323,35 +323,33 @@
 font = %22
-bold %22 + textHeight
+normal %22 + points
  + %22pt A
@@ -358,19 +358,17 @@
 al%22;%0A%0A  
-var
+ 
  textWid
@@ -407,74 +407,18 @@
 idth
-;%0A%0A  var pad = textHeight * 0.25; // aovids cut-off g, j, y, etc.%0A
+ + pad;%0A  
   ca
@@ -444,22 +444,16 @@
 extWidth
- + pad
 , height
@@ -454,26 +454,22 @@
 height: 
-textHeight
+points
  + pad%7D)
@@ -473,16 +473,18 @@
 d%7D);%0A%0A  
+ 
+ 
 context.
@@ -495,27 +495,25 @@
  = %22
-bold %22 + textHeight
+normal %22 + points
  + %22
@@ -523,16 +523,18 @@
 Arial%22;%0A
+  
   contex
@@ -560,16 +560,18 @@
 enter%22;%0A
+  
   contex
@@ -595,24 +595,26 @@
 %22middle%22;%0A  
+ 
+ 
 context.fill
@@ -631,16 +631,18 @@
  color;%0A
+  
   contex
@@ -677,35 +677,44 @@
  2, 
-textHeight / 2);%0A%0A  var url
+(points + pad) / 2);%0A%0A    cache%5Bkey%5D
  = c
@@ -741,19 +741,20 @@
 RL();%0A  
-var
+%7D%0A%0A 
  texture
@@ -789,11 +789,18 @@
 ure(
-url
+cache%5Bkey%5D
 );%0A%0A
@@ -809,16 +809,17 @@
 return %7B
+ 
 %0A    map
@@ -828,16 +828,17 @@
 texture,
+ 
 %0A    wid
@@ -851,16 +851,17 @@
 xtWidth,
+ 
 %0A    hei
@@ -869,18 +869,20 @@
 ht: 
-textHeight
+points + pad
 %0A  %7D

use dataURL and cache results