@opendata-ai/openchart-vanilla 2.4.0 → 2.6.0

package/dist/index.js

@@ -2352,6 +2352,9 @@ function renderLineMark(mark, index) {
     if (mark.strokeDasharray) {
       path.setAttribute("stroke-dasharray", mark.strokeDasharray);
     }
+    if (mark.opacity != null) {
+      path.setAttribute("opacity", String(mark.opacity));
+    }
     g.appendChild(path);
   }
   if (mark.label?.visible) {
@@ -2788,48 +2791,17 @@ var BRAND_FONT_SIZE = 20;
 var BRAND_MIN_WIDTH2 = 120;
 var BRAND_URL = "https://tryopendata.ai";
 var XLINK_NS = "http://www.w3.org/1999/xlink";
-function brandPosition(layout) {
+function renderBrand(parent, layout) {
+  if (layout.dimensions.width < BRAND_MIN_WIDTH2) return;
   const { width } = layout.dimensions;
   const padding = layout.theme.spacing.padding;
   const rightEdge = width - padding;
+  const fill = layout.theme.colors.axis;
   const { chrome } = layout;
   const xAxisExtent = computeXAxisExtent(layout);
   const bottomOffset = layout.area.y + layout.area.height + xAxisExtent;
   const firstBottom = chrome.source ?? chrome.byline ?? chrome.footer;
   const chromeY = firstBottom ? bottomOffset + firstBottom.y : bottomOffset + layout.theme.spacing.chartToFooter;
-  const y = chromeY + BRAND_FONT_SIZE;
-  const dataWidth = estimateTextWidth("Data", BRAND_FONT_SIZE, 600);
-  const dataX = rightEdge - dataWidth;
-  const openX = dataX;
-  return { openX, dataX, y, fill: layout.theme.colors.axis };
-}
-function renderBrandOpen(parent, layout) {
-  if (layout.dimensions.width < BRAND_MIN_WIDTH2) return;
-  const { openX, y, fill } = brandPosition(layout);
-  const a = createSVGElement("a");
-  a.setAttribute("href", BRAND_URL);
-  a.setAttributeNS(XLINK_NS, "xlink:href", BRAND_URL);
-  a.setAttribute("target", "_blank");
-  a.setAttribute("rel", "noopener");
-  a.setAttribute("class", "viz-axis-ref");
-  const text = createSVGElement("text");
-  setAttrs(text, {
-    x: openX,
-    y,
-    "font-family": layout.theme.fonts.family,
-    "font-size": BRAND_FONT_SIZE,
-    "font-weight": 500,
-    "text-anchor": "end",
-    "fill-opacity": 0.55
-  });
-  text.style.setProperty("fill", fill);
-  text.textContent = "Open";
-  a.appendChild(text);
-  parent.appendChild(a);
-}
-function renderBrandData(parent, layout) {
-  if (layout.dimensions.width < BRAND_MIN_WIDTH2) return;
-  const { dataX, y, fill } = brandPosition(layout);
   const a = createSVGElement("a");
   a.setAttribute("href", BRAND_URL);
   a.setAttributeNS(XLINK_NS, "xlink:href", BRAND_URL);
@@ -2838,16 +2810,23 @@ function renderBrandData(parent, layout) {
   a.setAttribute("class", "viz-chrome-ref");
   const text = createSVGElement("text");
   setAttrs(text, {
-    x: dataX,
-    y,
+    x: rightEdge,
+    y: chromeY,
     "font-family": layout.theme.fonts.family,
     "font-size": BRAND_FONT_SIZE,
-    "font-weight": 600,
-    "text-anchor": "start",
+    "text-anchor": "end",
+    "dominant-baseline": "hanging",
     "fill-opacity": 0.55
   });
   text.style.setProperty("fill", fill);
-  text.textContent = "Data";
+  const openSpan = createSVGElement("tspan");
+  openSpan.setAttribute("font-weight", "500");
+  openSpan.textContent = "Open";
+  text.appendChild(openSpan);
+  const dataSpan = createSVGElement("tspan");
+  dataSpan.setAttribute("font-weight", "600");
+  dataSpan.textContent = "Data";
+  text.appendChild(dataSpan);
   a.appendChild(text);
   parent.appendChild(a);
 }
@@ -2891,9 +2870,8 @@ function renderChartSVG(layout, container) {
   svg.appendChild(clippedGroup);
   renderAnnotations(svg, layout);
   renderLegend(svg, layout.legend);
-  renderBrandOpen(svg, layout);
   renderChrome(svg, layout);
-  renderBrandData(svg, layout);
+  renderBrand(svg, layout);
   container.appendChild(svg);
   return svg;
 }