/index.html

## index.html
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Reusable Sparkline</title>

    </head>
    <body>
        <script src="http://d3js.org/d3.v3.min.js"></script>
        <script src="sparkline.js"></script>
        <script type="text/javascript">
            var svg = d3.select("body").append("svg")
            var data = [3, 13, 2, 7, 5, 2, 1, 3, 10, 9, 2, 5, 7]
            var data2 = [1,5,20,12,7,15,10,7,3]
            var margin = {top: 20, right: 20, bottom: 30, left: 40};

            var g = svg.append("g")
                .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

            var g2 = svg.append("g")
                .attr("transform", "translate(" + 523 + "," + margin.top + ")");

            var spark = sparkline()
                            .data(data)
            spark(g)
            spark.stroke("#0000ff").data(data2)(g2)
        </script>
    </body>
</html>

## sparkline.js
function sparkline() {
  var width = 30, // default width
      height = 20, // default height
      margin = 0,
      stroke = "#2BD132",
      data = [];

  var my = function(g) {
    var xScale = d3.scale.linear().domain([0, data.length]).range([0 + margin, width - margin]),
        yScale = d3.scale.linear().domain([0, d3.max(data)]).range([0 + margin, height - margin]);

    var line = d3.svg.line()
          .x(function(d,i) { return xScale(i); })
          .y(function(d) { return -1 * yScale(d); })


    g.append("g")
          .append("path")
          .attr("stroke", stroke)
          .attr("fill", "none")
          .attr("stroke-width", 2)
          .attr("d", line(data));
  }

  my.width = function(value) {
    if (!arguments.length) return width;
    width = value;
    return my;
  };

  my.height = function(value) {
    if (!arguments.length) return height;
    height = value;
    return my;
  };

  my.margin = function(value) {
    if (!arguments.length) return margin;
    margin = value;
    return my;
  };

  my.data = function(value) {
    if (!arguments.length) return data;
    data = value;
    return my;
  };

  my.stroke = function(value) {
    if (!arguments.length) return stroke;
    stroke = value;
    return my;
  };

  return my;
}
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<title>Reusable Sparkline</title>

	</head>
	<body>
	<script src="http://d3js.org/d3.v3.min.js"></script>
	<script src="sparkline.js"></script>
	<script type="text/javascript">
	var svg = d3.select("body").append("svg")
	var data = [3, 13, 2, 7, 5, 2, 1, 3, 10, 9, 2, 5, 7]
	var data2 = [1,5,20,12,7,15,10,7,3]
	var margin = {top: 20, right: 20, bottom: 30, left: 40};

	var g = svg.append("g")
	.attr("transform", "translate(" + margin.left + "," + margin.top + ")");

	var g2 = svg.append("g")
	.attr("transform", "translate(" + 523 + "," + margin.top + ")");

	var spark = sparkline()
	.data(data)
	spark(g)
	spark.stroke("#0000ff").data(data2)(g2)
	</script>
	</body>
	</html>
	function sparkline() {
	var width = 30, // default width
	height = 20, // default height
	margin = 0,
	stroke = "#2BD132",
	data = [];

	var my = function(g) {
	var xScale = d3.scale.linear().domain([0, data.length]).range([0 + margin, width - margin]),
	yScale = d3.scale.linear().domain([0, d3.max(data)]).range([0 + margin, height - margin]);

	var line = d3.svg.line()
	.x(function(d,i) { return xScale(i); })
	.y(function(d) { return -1 * yScale(d); })


	g.append("g")
	.append("path")
	.attr("stroke", stroke)
	.attr("fill", "none")
	.attr("stroke-width", 2)
	.attr("d", line(data));
	}

	my.width = function(value) {
	if (!arguments.length) return width;
	width = value;
	return my;
	};

	my.height = function(value) {
	if (!arguments.length) return height;
	height = value;
	return my;
	};

	my.margin = function(value) {
	if (!arguments.length) return margin;
	margin = value;
	return my;
	};

	my.data = function(value) {
	if (!arguments.length) return data;
	data = value;
	return my;
	};

	my.stroke = function(value) {
	if (!arguments.length) return stroke;
	stroke = value;
	return my;
	};

	return my;
	}