turboMaCk/index.html

## index.html
<html>
<head>
<title>test</title>
</head>
<body>
<div id="mydiv"></div>
<div id="mydiv2"></div>

<script src="http://d3js.org/d3.v3.min.js"></script>
<script>
(function() {

  // first library's plugin

  var first = function(element) {
    this.container = element;
  }

  first.prototype = {
    init: function() {
      console.log('new first', this.container);

      return this;
    }
  }

  // second library's plugin

  var second = function(element) {
    this.container = element;
  }

  second.prototype = {
    init: function() {
      console.log('new second', this.container);

      return this;
    }
  }

  // library works with own objects

  var _wrap = function(selector) {
      this.element = d3.select(selector);

      return this;
  };

  _wrap.prototype = {
    first: function() {
      var chart = new first(this.element);

      return chart.init();
    },
    second: function() {
       var chart = new second(this.element);

       return chart.init();
     }
  };

  // export to global namespace
  window.wrap = function(selector) {
    return new _wrap(selector);
  };

})();
</script>

<script>
(function() {

  // Init in page
  var a = wrap('#mydiv').first();
  var b = wrap('#mydiv2').second();

 })();
</script>

</body>
</html>
	<html>
	<head>
	<title>test</title>
	</head>
	<body>
	<div id="mydiv"></div>
	<div id="mydiv2"></div>

	<script src="http://d3js.org/d3.v3.min.js"></script>
	<script>
	(function() {

	// first library's plugin

	var first = function(element) {
	this.container = element;
	}

	first.prototype = {
	init: function() {
	console.log('new first', this.container);

	return this;
	}
	}

	// second library's plugin

	var second = function(element) {
	this.container = element;
	}

	second.prototype = {
	init: function() {
	console.log('new second', this.container);

	return this;
	}
	}

	// library works with own objects

	var _wrap = function(selector) {
	this.element = d3.select(selector);

	return this;
	};

	_wrap.prototype = {
	first: function() {
	var chart = new first(this.element);

	return chart.init();
	},
	second: function() {
	var chart = new second(this.element);

	return chart.init();
	}
	};

	// export to global namespace
	window.wrap = function(selector) {
	return new _wrap(selector);
	};

	})();
	</script>

	<script>
	(function() {

	// Init in page
	var a = wrap('#mydiv').first();
	var b = wrap('#mydiv2').second();

	})();
	</script>

	</body>
	</html>