0

我选择承担的部分学校编程项目需要根据用户数据使用 PHP 生成条形图。我的老师已经明确表示我不能使用开源课程或任何其他人的代码。他还禁止我使用 CSS 来显示图表，部分声称这是不可能的（我在网上看到过方法）。

我简要了解了一些流行的 PHP 图形类，例如 Jpchart 和 Pchart，它们看起来都相当复杂，有数万行代码。

当然，必须编写一个类来生成 jpeg 也必须相当复杂。

有没有人有任何建议，或者我应该放下脚告诉他这些期望是不现实的？

4

5 回答 5

1

如果我们只是在谈论一个简单的条形图，他对 CSS 的看法是错误的，并且自 CSS 发明之日起就一直是错误的。<div>使用几个标签和少量 CSS创建条形图是微不足道的。

他可能正在寻找他理解的特定解决方案——也许是一个 HTML 表格？（我真的希望不要）或者使用 PHP 中的 GD 库生成图像。

如果我是你，我会选择一个不寻常的解决方案，比如 SVG。在 SVG 中生成图表，并将其输出到浏览器。符合他的标准，但没有使用他的任何“禁止”选项。（但请注意 - 在选择此选项之前，请确保您的老师使用支持 SVG [即比 IE8 更新] 的浏览器！）

于 2013-01-10T16:23:14.493 回答
0

禁止你使用 CSS 对他来说是个彻头彻尾的举动。如果不使用 GDlib 函数 [我假设这不是练习的重点]，您可以创建一个 1x2 单元格表并根据条形值设置单元格宽度，但如果没有CSS ，它会有点痛苦. 为避免引起 Dickbag 教授的愤怒，您将被困在为所有内容设置 HTML 属性。

您的讲师完全错误地认为 CSS 无法实现这一点。

如果他只是一个愤怒的老胡须，他可能想要这样的东西：

Tom:   |****      | 43%
Dick:  |***       | 27%
Harry: |********  | 82%

所以这就像回到 1981 年的一些 DEC PDP 一样。

编辑

由于您的讲师规定他需要图像形式的图形，因此您将需要使用GD 库函数。文档页面中的示例代码imagefilledrectangle()应该足以让您入门：

<?php
// Create a 55x30 image
$im = imagecreatetruecolor(55, 30);
$white = imagecolorallocate($im, 255, 255, 255);

// Draw a white rectangle
imagefilledrectangle($im, 4, 4, 50, 25, $white);

// Save the image
imagepng($im, './imagefilledrectangle.png');
imagedestroy($im);
于 2013-01-10T16:18:16.057 回答
0

这并不难。查看php中的图像函数。gd或图像魔法。

尤其是矩形功能对您来说会很有趣。

于 2013-01-10T16:13:32.470 回答
0

一旦您将其分解为基本任务，这很简单。回想一下你最初在学校是如何教你做图表的：

  • 你从图表的大小开始（即纸张大小）
  • 你知道你需要画多少条，这样你就可以计算出每个条需要的空间
  • 您知道数据中的最大值和最小值，因此很容易计算出比例

剩下的只是键和标题！

于 2013-01-10T16:23:57.087 回答
0

通过 html/css 绘制图表是完全可能的。

假设您制作了条形图。首先计算 min + max 并定义两者的高度。之后，取所有其他值并确定它们的高度（最小值/最大值的某个百分比）。在那之后，你在我心中有两个选择。1，将您的html呈现为带有单元格的表格，并在给定高度/宽度的情况下明确表示。或使用 id 和类渲染一堆 div，然后动态创建您的 css（与样式属性内联或仅将 css 动态写入脚本标签）并在您的 css 中根据您之前决定的设置高度。

这是使用 D3js 库的一些代码。这种方法非常合理，只需使用 php 而不是 js 以类似的方式编写代码。

如果您想查看其他示例：这里有一些html/css 图表示例。pcharts是一个很棒的库，它使用 GD php 扩展来生成 jpg/png 格式的图表图像。如果您计划即时生成图像，这个库应该会提供一些很好的灵感。

更新 我忍不住做了一个 php/css 示例：

<html>
<head>
    <style type="text/css">
        .bar {
            background: #660000;
            color: #fff;
            height: 20px;
            width: auto;
            min-width: 2px;
            clear: both;
            margin-bottom: 5px;
            padding: 5px;
            font-weight: bold;
        }
    </style>
</head>
<body>
<?php

    //array of values
    $vals = array(
        'git' => 9001, 
        'svn' => 4213, 
        'bitkeeper' => 7391,
        'mercurial' => 2114,
        'cvs' => 806, 
    );
    //minimim and maximum
    $min = 1;
    $max = 200;

    //calculate scale, draw, and loop
    foreach ($vals as $key => $val) {
        $scale = (2 * ($val-$min)/($max-$min))*8;
        echo('<div class="bar" style="width: '.$scale.'px" title="'.$key.' = '.$val.'">'.$key."</div>");
    }

?>
</body>
</html>
于 2013-01-10T16:19:53.003 回答