JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://d3js.org/d3.v3.min.js"></script>

CSS

.tick text {
  font-family: Georgia;
  font-size: 14px;
}

JavaScript

var data = [new Date("2016/01/01"), new Date("2016/01/03")];

var scale = d3.time.scale()
  .domain(d3.extent(data))
  .range([0, 400]);

var timeFormatWithDate = d3.time.format("%b %-d, %-I:%M%p");
var timeFormatWithoutDate = d3.time.format("%-I:%M%p");

var axis = d3.svg.axis()
  .scale(scale)
  .orient("left")
  .tickFormat(function(d, i) {
    var ticks = axis.scale().ticks();
    console.log(ticks);
    if (i > 0 && ticks[i - 1].getDay() === d.getDay()) {
      return timeFormatWithoutDate(d);
    } else {
      return timeFormatWithDate(d);
    }
  });

d3.select("body")
  .append("svg")
  .attr("width", 400)
  .attr("height", 420)
  .append("g")
  .attr("transform", "translate(200, 10)")
  .data(data)
  .call(axis);