输出数组变量javascript

问题描述:

我成功地能够输出for循环内最后随机生成的点(randomX,randomY)的坐标,但我似乎无法输出所有这些将依赖于用户需要多少。任何帮助,将不胜感激。谢谢。你可以在这里看到现场项目http://math.mercyhurst.edu/~cmihna/DataViz/D3Chart.html输出数组变量javascript

<!doctype html> 

<html> 
<head> 
    <script src="http://math.mercyhurst.edu/~lwilliams/js/d3.js"></script> 

    <style> 
     .axis path, 
     .axis line{ 
      fill: none; 
      stroke: purple; 

     } 

     .axis text { 
      font-family: sans-serif; 
      font-size:10px; 
     } 
    </style> 


</head> 




<body> 

    <h1> D3 Scatter Plot</h1> 



    <script align='center' > 

     // 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 <n; i++) 
     { 

      var dataset = [] 


      for (var i = 0; i < 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) 


     </script> 






</body> 

<footer> 

<br> 
<br> 
<br> 
<br> 
<input type="button" value="Enter New Number" onClick="window.location.href=window.location.href"> 

</footer> 


</html> 
+0

尝试在for循环中放置'document.write(randomX +','+ randomY)' – KiiroSora09

+0

我已经试过了,它不起作用 – Thesystem32

+0

然后请更新已经尝试过的内容,以便我们不会猜测。 您是否尝试过在for循环之外放置声明'var dataset = []'并在最后(在'document.write(out)'之后循环它以输出'dataset'数组的每个元素? – KiiroSora09

fgured出来,单独的for循环

for (var i = 0; i <n; i++) 
     { 

     document.write("(" + dataset[i] + ")") 


     } 

我知道你已经想通了,但解释是很重要的:JavaScript没有块作用域(除非您使用let - 请参阅下面的注释)。这意味着外循环中的var与内循环中的var i相同。所以,它一直在重置,循环从未完成。

通常,当我们有两个循环一个在另一个里面时,我们使用var ivar j

+0

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/let –

+0

是的,我记得当我写答案时,这是ECMA 6,对吗?什么浏览器接受它? –

+0

Mozilla我相信.. :) –