fix: text layer properties

README.md

@@ -692,6 +692,10 @@ bertin.draw({
 - <b>position</b>: position of the text. It can be an array with x,y coordinates. For example [100,200]. It can be also a string defining the position. "topleft", "top", "topright", "left", "middle", "right", "bottomleft", "bottom", "bottomright" (default: "topleft")
 - <b>text</b>: text to display. With the backticks, it is possible to display a text on several lines (default: "Your text here!")
 - <b>fontSize</b>: text size (default: 15)
+- <b>fontFamily</b>: font family. "Pacifico","Roboto","Rubik","Ubuntu" (default: "Robotto")
+- <b>textDecoration</b>: text decoration. "none", "underline", "line-through", "overline" (default:"none")
+- <b>fontWeight</b>: font weight. "normal", "bold", "bolder", "lighter" (default: "normal")
+- <b>fontStyle</b>: font style. "normal", "italic", "oblique" (default: "normal")
 - <b>margin</b>: margin around the text (default: 0)
 - <b>anchor</b>: text anchor. start, middle, end (default: "start")
 - <b>baseline</b>: alignment baseline. "baseline", "middle", "hanging" (default:"hanging")

src/draw.js

@@ -304,6 +304,10 @@ if (layer.type == "label") {
         fill: layer.fill,
         stroke: layer.stroke,
         fontSize: layer.fontSize,
+        fontFamily: layer.fontFamily,
+        textDecoration: layer.textDecoration,
+        fontWeight: layer.fontWeight,
+        fontStyle: layer.fontStyle,
         margin: layer.margin,
         anchor: layer.anchor, // start, middle, end
         baseline: layer.baseline, // baseline, middle, hanging

src/text.js

@@ -5,7 +5,11 @@ export function addtext(selection, width, height, options = {}){
   let position = options.position ? options.position : "topright";
     let text = options.text ? options.text : "Your text here!";
     let fontSize = options.fontSize ? options.fontSize : 15;
+    let fontFamily = options.fontFamily ? options.fontFamily : "Robotto";
     let margin = options.margin ? options.margin : 0;
+    let textDecoration = options.textDecoration ? options.textDecoration : "none";
+    let fontWeight = options.fontWeight ? options.fontWeight : "normal";
+    let fontStyle = options.fontStyle ? options.fontStyle : "normal"
     let anchor = options.anchor ? options.anchor : "start"; // start, middle, end
     let baseline = options.baseline ? options.baseline : "baseline"; // baseline, middle, hanging
     let fill = options.fill ? options.fill : "#474342";
@@ -90,6 +94,10 @@ export function addtext(selection, width, height, options = {}){
     let tmp = selection
       .append("text")
       .attr("font-size", `${fontSize}px`)
+      .attr("font-family", fontFamily)
+      .attr("font-style", fontStyle)
+      .attr("text-decoration", textDecoration)
+      .attr("font-weight", fontWeight)
       .text(txt[i]);
     selection.node().appendChild(tmp.node());
     document.body.appendChild(selection.node());
@@ -154,6 +162,10 @@ export function addtext(selection, width, height, options = {}){
       .attr("x", x + margin_x)
       .attr("y", y - +delta + margin_y)
       .attr("font-size", `${fontSize}px`)
+      .attr("font-style", fontStyle)
+      .attr("text-decoration", textDecoration)
+      .attr("font-weight", fontWeight)
+      .attr("font-family", fontFamily)
       .attr("dy", (d, i) => i * fontSize)
       .attr("text-anchor", anchor)
       .attr("alignment-baseline", "hanging")