click

mkobetic · Mar 28, 2024 · 632ed8c · 632ed8c
1 parent 810d2dd
commit 632ed8c
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 3 deletions.
diff --git a/TODO.md b/TODO.md
@@ -24,7 +24,6 @@
 
 ### coin2html
 
-- console log data on click
 - tooltips for columns, inputs and wherever useful
 - show details of selected posting
 - add location info

diff --git a/cmd/coin2html/js/src/index.ts b/cmd/coin2html/js/src/index.ts
@@ -973,7 +973,8 @@ function viewChart(
     .attr("y", (d) => y(d.date))
     .attr("x", (d) => x(d.offset ?? 0))
     .attr("width", (d) => x(d.width ?? 0))
-    .attr("height", rowHeight - 1);
+    .attr("height", rowHeight - 1)
+    .on("click", (e, d) => console.log(e, d));
 
   // bar text
   layer

diff --git a/cmd/coin2html/js/styles.css b/cmd/coin2html/js/styles.css
@@ -67,3 +67,7 @@ td.amount {
   font-family: sans-serif;
   font-size: 11px;
 }
+
+.layer rect:hover {
+  fill: gray;
+}
diff --git a/examples/yearly/viewer.html b/examples/yearly/viewer.html
@@ -76,6 +76,10 @@
   font-size: 11px;
 }
 
+.layer rect:hover {
+  fill: gray;
+}
+
 	</style>
 </head>
 <body>
@@ -47003,7 +47007,8 @@ <h1>
         .attr("y", (d) => y(d.date))
         .attr("x", (d) => x(d.offset ?? 0))
         .attr("width", (d) => x(d.width ?? 0))
-        .attr("height", rowHeight - 1);
+        .attr("height", rowHeight - 1)
+        .on("click", (e, d) => console.log(e, d));
     // bar text
     layer
         .selectAll("text")