Edit in JSFiddle

var data_set = [
		{date:"2017-1-1", val:16},
		{date:"2017-1-2", val:6},
		{date:"2017-1-3", val:1},
		{date:"2017-1-4", val:5},
		{date:"2017-1-5", val:26},
		{date:"2017-1-6", val:36},
		{date:"2017-1-7", val:10},
		{date:"2017-1-8", val:8},
		{date:"2017-1-9", val:21},
		{date:"2017-1-10", val:26},
		{date:"2017-1-11", val:19},
		{date:"2017-1-12", val:20},
] ;

var timeparser = d3.timeParse("%Y-%m-%e");
data_set = data_set.map( function(d){ 
		return  { date: timeparser(d.date), val:d.val } ;
  } );

var width=500, height=200 ;
var x_scale = d3.scaleTime()
	.domain( [ d3.min(data_set.map( function(d){return d.date;} ) ), d3.max(data_set.map( function(d){return d.date;} ) )] )
	.range([0, width]);
  
var y_scale = d3.scaleLinear()
	.domain([0, d3.max( data_set.map(function(d) {return d.val; }) ) ])
	.range([height, 0]);

var valueline = d3.line()
    .x(function(d) { return x_scale(d.date); })
    .y(function(d) { return y_scale(d.val); })
    ;

var line_svg = d3.select("body")
	.append("svg")
  .attr("width", 800)
  .attr("height", 300)
  ;
line_svg.append( "path" )
  .attr("transform", "translate(40, 20)")
  .datum(data_set)
  .attr("d", valueline)
  .attr("fill","none")
  .attr("stroke", "steelblue")
  .attr("stroke-width", 2)
;
line_svg.append("g")
	.attr("transform", "translate(40,"+(height+20)+")")
	.call(d3.axisBottom(x_scale).tickFormat(d3.timeFormat("%m/%e")))
  ;
line_svg.append("g")
	.attr("transform", "translate(40,20)")
	.call(d3.axisLeft(y_scale))
  ;

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