outputing array variables javascript
<p>I am successfully able to output the coordinates of the last randomly generated points (randomX,randomY) inside the for loop, but I cannot seem to output all of them which would be dependant on how many the user wants. Any help would be appreciated. thanks. You can see the live project here <a href="http://math.mercyhurst.edu/~cmihna/DataViz/D3Chart.html" rel="nofollow">http://math.mercyhurst.edu/~cmihna/DataViz/D3Chart.html</a></p>

<pre><code>&lt;!doctype html&gt;

&lt;html&gt;
&lt;head&gt;
    &lt;script src="http://math.mercyhurst.edu/~lwilliams/js/d3.js"&gt;&lt;/script&gt;

    &lt;style&gt;
        .axis path,
        .axis line{
            fill: none;
            stroke: purple;

        }

        .axis text {
            font-family: sans-serif;
            font-size:10px;
        }
    &lt;/style&gt;


&lt;/head&gt;




&lt;body&gt;

    &lt;h1&gt; D3 Scatter Plot&lt;/h1&gt;



    &lt;script align='center' &gt;

        // create variables for the size of the SVG area that D3 will create
        var w = 800
        var h = 600



        var pad = { left: 50, top: 50, bottom: 20, right: 20 }

        var chartHeight = h - pad.top - pad.bottom
        var chartWidth = w - pad.left - pad.right


        var n = prompt("Enter the number of rolls")


        for (var i = 0; i &lt;n; i++)
        {

            var dataset = []


            for (var i = 0; i &lt; n; i++) 

            {
            var randomX = Math.round(Math.random()*w)
            var randomY = Math.round(Math.random()*h)
            var randomR = Math.round(Math.random()*20)



            dataset.push([randomX,randomY,randomR])



            }

            document.write(randomX + ' , ' + randomY)


            console.log(dataset)

        }





        var xscale = d3.scale.linear() 
            .domain([0, d3.max( dataset, function(d) { return d[0] } )])
            .range([0,chartWidth])

        var yscale = d3.scale.linear()
            .domain([0, d3.max( dataset, function(d) { return d[1] } )])
            .range([chartHeight,0])





        var scatterSVG = d3.select("body")
            .append('svg')
            .attr('width', w)
            .attr('height', h)




        scatterSVG.selectAll('circle')
            .data(dataset)
            .enter()
            .append('circle')
            .attr('cx', function(d){ return xscale(d[0]) + pad.left })
            .attr('cy', function(d){ return yscale(d[1]) + pad.top })
            .attr('r', function(d){ return d[2] })
            .attr('fill', function(d) {
                return 'rgb(0,'+d[0]+','+d[1]+')'
            })



        var yAxis = d3.svg.axis()   
            .scale(yscale)
            .orient('left')
            .ticks(6)

        var yAxisObject = scatterSVG.append('g')
            .call(yAxis)
            .attr("class", "axis")
            .attr("transform", 'translate('+pad.left+','+pad.top+')')

        var xAxis = d3.svg.axis()
            .scale(xscale)
            .orient('bottom')
            .ticks(3)

        var xAxisObject = scatterSVG.append('g')
            .call(xAxis)
            .attr("class","axis")
            .attr("transform", 'translate('+pad.left+','+(h-pad.bottom)+')')




            var out = "Here are the coordinates from your " + n + " rolls: ";

            document.write(out)


        &lt;/script&gt;






&lt;/body&gt;

&lt;footer&gt;

&lt;br&gt;
&lt;br&gt;
&lt;br&gt;
&lt;br&gt;
&lt;input type="button" value="Enter New Number" onClick="window.location.href=window.location.href"&gt;

&lt;/footer&gt;


&lt;/html&gt;
</code></pre>