3

私は決して Web デザイナーではないので、できる限り詳細なヘルプを提供したいと思います。

入力したデータを 0 ～ 100% の棒グラフで追跡する Web サイトを作成したいと考えています。グラフが到達できる最大数を入力すると、一部のデータ ポイントが時折更新され、完了棒グラフに反映されます。

どうすればこれを行うことができますか？

基本的な HTML と PHP は知っていますが、長い間どちらも使用していません。

4

3 に答える 3

9

ほとんどの提案はやり過ぎだと思います。単純な棒グラフだけが必要な場合は、追加のライブラリや依存関係は必要ありません。プレーンな HTML/CSS で十分です...

PS: クイック コード サンプル、Firefox 3.x でのみテスト済み

<style type="text/css">
.bar
{
    background-color: green;
    position: relative;
    height: 16px;
    margin-top: 8px;
    margin-bottom: 8px; 
}
</style>

<div id="barcontainer" style="width:200px;">
    <div id="bar1" class="bar" style="width:43%;"></div>
    <div id="bar2" class="bar" style="width:12%;"></div>
    <div id="bar3" class="bar" style="width:76%;"></div>
    <div id="bar4" class="bar" style="width:100%;"></div>
</div>

個々のバーの幅は、javascript を使用して簡単に変更できます (幅を変更するだけです)。

于 2009-07-14T20:00:07.973 に答える
6

あなたが新人だと言ったことは知っていますが、Google ビジュアライゼーション API を見てみる必要があります。あなたが望むようなことをするのに良いものがいくつかあります。
http://code.google.com/apis/visualization/

于 2009-07-14T19:21:17.100 に答える
0

この問題に取り組む方法は 2 つあります。バックエンドでグラフを生成する (おそらくあなたの場合は PHP を使用) か、JavaScript を使用してクライアント側で実行します。

私は言語を本当に知らないので、PHPでそれを行うことの詳細はわかりませんが、PHPでのグラフ生成に関する情報はたくさんあると確信しています.

JavaScript のアプローチでは、flot (jquery 用) とflotr (プロトタイプ用) の両方を以前に使用しました。私はそれらが大好きで、棒グラフを含むあらゆる種類のグラフを生成する方法について、両方のライブラリの優れたドキュメントと例があります。

于 2009-07-14T19:23:22.697 に答える