<script>

var svg=d3.select("body").append("svg")
	.attr("width", 960)
    .attr("height", 500)
	
var events = []
svg.on('click',function () {
	// Получим название блока
	nameblock=document.getElementById('idnameblock');
	if (nameblock.value=="") {
		alert("Пусто");
		return;
	}

	
	//alert('xxxxxx');
	
	events.push(d3.event)
	
	var elem = svg.selectAll("myCircleText").data(events)
	
	var elemEnter = elem.enter()
	    .append("g")
		.attr("class","myCircleText")
	    .attr("transform", function(d) {
          return "translate(" + function (d) { return d.x || d.pageX } + "," + function (d) { return d.y || d.pageY } + ")";
      });
	  
	  
	var circle = elemEnter.append("circle")
					.attr("cx", function (d) { return d.x || d.pageX })
					.attr("cy", function (d) { return d.y || d.pageY })
					.attr("r", 40)
					.attr("stroke", "black")
					.attr("stroke-width", "2")
					.attr("fill", "white"); 

	elemEnter.append("text")
	     .attr('x', function (d) { return d.x-10 || d.pageX-10 }) // задание координат элемента text
		 .attr('y', function (d) { return d.y || d.pageY })
	     .text(function(d){return nameblock.value})	
	
	nameblock.value=""; // Очистим поле	
})	
	
	
</script>

<script>

var svg=d3.select("body").append("svg")
	.attr("width", 960)
    .attr("height", 500)

var data = [];	
	
	
var events = []
svg.on('click',function () {
	// Получим название блока
	nameblock=document.getElementById('idnameblock');
	if (nameblock.value=="") {
		alert("Пусто");
		return;
	}

	
	//alert('xxxxxx');
	
	events.push(d3.event)
	
	data.push({
		x: d3.event.x,
		y: d3.event.y,
		name: nameblock.value
	})
	
	var elem = svg.selectAll("myCircleText").data(data)
	
	var elemEnter = elem.enter()
	    .append("g")
		.attr("class","myCircleText")
	    .attr("transform", function(d) {
          return "translate(" + function (d) { return d.x || d.pageX } + "," + function (d) { return d.y || d.pageY } + ")";
      });
	  
	  
	var circle = elemEnter.append("circle")
					.attr("cx", function (d) { return d.x || d.pageX })
					.attr("cy", function (d) { return d.y || d.pageY })
					.attr("r", 40)
					.attr("stroke", "black")
					.attr("stroke-width", "2")
					.attr("fill", "white"); 

	elemEnter.append("text")
	     .attr('x', function (d) { return d.x-10 || d.pageX-10 }) // задание координат элемента text
		 .attr('y', function (d) { return d.y || d.pageY })
	     .text(function(d){return d.name})	
	
	nameblock.value=""; // Очистим поле	
})	
	
	
</script>