【问题标题】:How do i grab values from this php file?我如何从这个 php 文件中获取值?
【发布时间】:2013-04-03 22:12:37
【问题描述】:


我最近进入了 d3 javascript 库。

我制作了一个从数组中获取随机值的散点图

这里是代码

<!DOCTYPE html>
<meta charset="utf-8">
<head>
    <script type="text/javascript" src="d3.v3.js"></script>
    <style>
        .axis path,
        .axis line
        {
            fill: none;
            stroke: black;
            shape-rendering: crispEdges;
        }

        .axis text
        {
            font-family: sans-serif;
            font-size: 11px;
        }
    </style>
</head>
<body>
    <script type="text/javascript">

        //Width and height
        var w = 500;
        var h = 300;
        //fix padding issues
        var padding = 30;

        //var dataset = [
            //          [5, 20], [480, 90], [250, 50], [100, 33], [330, 95],
                //      [410, 12], [475, 44], [25, 67], [85, 21], [220, 88], [600, 150], [77, 69], [290, 68]

                     // ];

        var dataset = [];
        var numDataPoints = 50;
        var xRange = Math.random() * 1000;
        var yRange = Math.random() * 1000;
        for (var i = 0; i < numDataPoints; i++) {
            var newNumber1 = Math.round(Math.random() * xRange);
            var newNumber2 = Math.round(Math.random() * yRange);
            dataset.push([newNumber1, newNumber2]);
            }

        //Create scale functions
        var rScale = d3.scale.linear()
                 .domain([0, d3.max(dataset, function(d) { return d[1]; })])
                 .range([2, 5]);

        var xScale = d3.scale.linear()
            .domain([0, d3.max(dataset, function(d) { return d[0]; })])
            .range([padding, w - padding * 2]);

        var yScale = d3.scale.linear()
            .domain([0, d3.max(dataset, function(d) { return d[1]; })])
            .range([h - padding, padding]);

        //Create SVG element
        var svg = d3.select("body")
            .append("svg")
            .attr("width", w)
            .attr("height", h);

        //create circles
        svg.selectAll("circle")
           .data(dataset)
           .enter()
           .append("circle")
           .attr("cx", function(d) {
                return xScale(d[0]); //use scale function
           })
           .attr("cy", function(d) {
                return yScale(d[1]); //use scale function
           })
           .attr("r", function(d) {
                 return rScale(d[1]);
           });

        //create svg text   
        //svg.selectAll("text")
         //  .data(dataset)
         //  .enter()
         //  .append("text")
         //  .text(function(d) {
         //         return d[0] + "," + d[1];
         //  })
         //  .attr("x", function(d) {
         //         return xScale(d[0]);
         //  })
          // .attr("y", function(d) {
         //         return yScale(d[1]);
         //  })
         //  .attr("font-family", "sans-serif")
          // .attr("font-size", "11px")
          // .attr("fill", "red");

        //create axis
        var xAxis = d3.svg.axis()
            .scale(xScale)
            .orient("bottom")
            .ticks(5);
        //place axis    
        svg.append("g")
            .attr("class", "axis")
            .attr("transform", "translate(0," + (h - padding) + ")")
            .call(xAxis);

        //define y axis
        var yAxis = d3.svg.axis()
              .scale(yScale)
              .orient("left")
              .ticks(5);
        //place y axis    
        svg.append("g")
            .attr("class", "axis")
            .attr("transform", "translate(" + padding + ",0)")
            .call(yAxis);

    </script>
</body>

如您所见,它绘制了随机创建并放入数组中的值。这很棒,但我想做一个小改动。我想创建一个生成随机数的 php 文件并改为绘制这些文件。

php文件很简单

<?php
echo rand(1, 50);
?>

那我实际上是怎么做的
1.获取php文件生成20个随机数
2.实际将这些数字放入散点图数组中。

谢谢!

【问题讨论】:

  • 你可以用Math.random()在JavaScript中生成随机数

标签: php javascript random d3.js


【解决方案1】:

这个 PHP 代码可以解决问题:

<?php
$i=20;
while($i > 0) {
    echo rand(1, 50);
    $i--;
}
?>

【讨论】:

  • 好的。那太棒了。但是我如何真正将这些值放入 html 文件中?
【解决方案2】:

要在 PHP 中生成随机数,请将项目推送到数组,然后回显:

$count = 0;
while($count < 20) {
    $numbers[$count] = rand(1, 50);
    $count++;
}
echo json_encode($numbers);

这应该产生类似:

[35,5,46,25,22,47,23,27,15,17,30,27,17,36,24,40,10,30,14,20]

使用JavaScript和AJAX,获取PHP页面并使用JSON.parse解析

获取 PHP 页面并解析(使用 jQuery):

var random = [];
$.get("random.php",function(data) {
    random = JSON.parse(data);
}

注意:对于 PHP 脚本,您也可以使用 array_push,但我使用上面的只是因为我们已经有一个 while 循环。

【讨论】:

  • 我了解 php。我仍然不知道如何将它们实现到我的 html 文件中。
  • @onTheInternet 更新了我的答案。希望有帮助!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-11-27
  • 2011-05-21
  • 2023-04-01
  • 2011-07-28
  • 1970-01-01
相关资源
最近更新 更多