Visual site map

This is a follow up to last month’s post on same name. What’s new? Tooltip - Earlier, we were employing the browser’s native tooltip. With this update we have customised tooltip with publish date and categories along with the title of post. Transitions - On hovering the circles turns green and tooltip pops up. .tooltip { position: absolute; font-family: monospace; pointer-events: none; background: silver; color: black; /* width: 400px; */ text-align: left; border-radius: 6px; padding: 5px 5px; left: 50%; margin-left: -60px; z-index: 1; } .

This is a follow up to last month’s post on same name. There are few changes made to the chart. Today marker: Instead of drawing a full line for the current year, we are allowing the line to grow with passing day. This is a major change. Transition: The trasnition effects are the major change here. Ironically, the amount of code change is minimum - tbh addition of 2 lines is all that’s needed.

This is an attempt to recreate the earlier created blog post through D3js. I’m more of backend developer, working predominantly in Python + SQL. But, trying out JS is long time wish, which got fufilled through a Udemy course and some good imspiration. The visuals can be improved vastly and can add few more options. But this post is to show the progress. Also, this is an attempt to conform that D3JS output can be hosted on our static site.

Once in a while we stumble into something interesting while we are not looking for it. This is a post on how I came across a chart while going through an online course, the experience in replicating the chart, the lessons I learnt. The instructor of the course - Course: Data Visualization Fundamentals and Best Practices by ObservableHQ. While going through his website I found this interesting chart - Blog Calendar.