Line Caps for Google Chart

by cristiscu

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" type="text/javascript"></script>
<script src="https://www.gstatic.com/charts/loader.js" type="text/javascript"></script>
<style>
g { stroke-linecap: round; stroke-linejoin: round; }
</style>
<div id="chart_div"></div>

JavaScript

google.charts.load('current',
	{ callback: makeChart, 'packages': [ 'corechart' ]
});

function makeChart() {
	new google.visualization.SteppedAreaChart($("#chart_div")[0])
    .draw(google.visualization.arrayToDataTable([
    					[ "sales", "USA", {role: "style"} ],
      				["2000", 66, "stroke-linecap: round; stroke-linejoin: round"],
              ["2001", 12, "stroke-linecap: round; stroke-linejoin: round"],
              ["2002", 88, "stroke-linecap: round; stroke-linejoin: round"],
              ["2003", 43, "stroke-linecap: round; stroke-linejoin: round"],
              ["2004", 18, "stroke-linecap: round; stroke-linejoin: round"]
    ]),
		{
        width: 600, height: 400,
        lineWidth: 15,
        legend: { position: "none" },
        chartArea: { width: "80%" },
        vAxis: { viewWindow: { min: 0, max: 100 } },
    });
}