私たちのプロジェクトの開発中に、クライアントhtmlで大量のグラフィックをレンダリングする必要に直面しました。 サーバーの負荷を最小限に抑えるという観点から見ると、クライアント側で3次元グラフィックスを構築することが唯一の正しい決定です。 この分野から既製の適切なJSソリューションを検索する際に、
Raphael JSライブラリに完全にフックしました。これにより、現在のすべてのブラウザーでベクターグラフィックスを簡単に描画できます。 機能を理解し、主要なタイプのダイアグラムを作成するためのいくつかの機能をデバッグしたので、ここでベストプラクティスを共有することにしました。
だから。 以下に説明する例では、RaphaelとPHPを使用して、画像に示されているSVG形式の円グラフを作成します。 私たちは、ソースコードを可能な限り詳細に記述しようとしました。それは、自分でそれを理解するための強さや時間を見つけられなかったすべての人々を助けるためです。
Circle.phpファイル:<?php
ファイルtest.php: <?php include("circle.php"); $params = array (
上記のソースコードは完全に機能します。 より深く掘り下げて、自分で提示された資料を理解したい人は誰でも
、ライブラリを
ダウンロードして、 3つのファイル(circle.php、test.php、raphael-min.js)を1つの全体に集めることができ
ます 。
ここで与えられた例のデモ。
プロジェクトのより明確で多様な例は
こちらです。
勾配塗りつぶし(0-#BCE408-#5FBB00)がRaphael構文の観点からどのように機能するか、およびこのライブラリーの機能とパラメーターに関する他の点については、
ドキュメントで詳細に説明されてい
ます 。 ちなみに、このソリューションの詳細なドキュメント、幅広い機能、およびブラウザ間の互換性は、同様のツールに対するこのライブラリの議論の余地のない利点です。
私たちの経験が、JSツールを使用してhtmlでベクターグラフィックスを作成するタスクに最初に出会ったすべての人に役立つことを願っています。 このトピックに関するすべての質問とコメントに答えようとします。