Flashチャートコンポーネント-Open Flash Chart 2.0を使用するいくつかの問題と解決方法


Open Flash Chart 2.0はFlashのグラフを生成するためのコンポーネントであり、オープンソース、無料、機能が強く、グラフがきれいで、ヒント情報を表示することができ、本人が現在最も良いと考えているflashグラフ描画コンポーネントである.グラフデータフォーマットはJSONです.
この記事の主な目的は、Open Flash Chart 2.0を使用する過程で出会った問題と解決策のまとめを記述することです.
一、元の解凍パッケージのインスタンスはFlashグラフを表示できない
Open-flash-chart-2-Lug-Wyrm-Charmerを解凍します.zipファイル、data-filesディレクトリのいくつかの例はほとんど使えません.もしあなたもこのような状況に遭遇したら、私の次の方法で、Open Flash Chart 2.0の持参例の豊富できれいなflashグラフを見てみましょう.
1、次の例はWEBでしか見ることができず、ローカル形式では見ることができません.2、open-flash-chart-2-Lug-Wyrm-Charmer.zip解凍中のdata-filesディレクトリ、jsディレクトリ、open-flash-chart.swfファイルはWEBルートディレクトリにコピーし、jquery.jsはjsディレクトリに格納されます.3、以下のコードをindexとして保存する.phpファイルでは、WEBですべてのインスタンスのflashグラフ効果を参照できます.注意:このコンテンツの最後にopen-flash-char-2のダウンロードが提供され、圧縮パッケージにはASPとPHPをサポートするすべてのインスタンスを閲覧するページがあります.他の言語の場合は、ディレクトリファイルの読み取りに関する次のコードクリップを変更できます.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<script language="JavaScript" type="text/JavaScript" src="js/jQuery.js"></script>
<script language="JavaScript" type="text/JavaScript" src="js/swfobject.js"></script>
<script>
$(document).ready(function(){
  $(".view").click(function(){
    var url='data-files/'+$("#file").val();
    swfobject.embedSWF("open-flash-chart.swf","my_chart","100%","350","9.0.0","expressInstall.swf",{"data-file":url});
  });
  $(".open").click(function(){
    var url='data-files/'+$("#file").val();
    location.href=url;
  });
  var url='data-files/'+$("#file").val();
  swfobject.embedSWF("open-flash-chart.swf","my_chart","100%","350","9.0.0","expressInstall.swf",{"data-file":url});
});
</script>
</head>
<body>
<table width="1030" border="0" cellpadding="0" cellspacing="0">
<tr><td height="50">
<select id="file">
<?php
$real_dir='data-files';
if($dir = @opendir($real_dir)) {
  while (($file_name = readdir($dir)) !== false){
    $path_parts = pathinfo($file_name);
    if($path_parts['extension']=='txt')
      echo '<option value="'.$path_parts['basename'].'">'.$path_parts['basename'].'</option>';
  }
  closedir($dir);
}else{
  echo "       :$real_dir";
  exit;
}
?>
</select>
<button class="view">    </button>
<button class="open">    </button>
</td></tr>
<tr>
<td colspan=3><div id="my_chart"></div></td>
</tr>
</table>
</body>
</html>

二、Flashグラフの中国語表示文字化けし
正式に使用する場合、グラフの表示内容はすべて実際のプロジェクトに基づいて生成されたjsonフォーマットデータであり、もし私たちが中国語でいくつかの内容を表示するならば、utf-8符号化を必要としないならば、中国語は文字化けの山を表示します.したがって、グラフ表示データを処理する独立ページ(一般的にこのページで生成された結果はjson形式のデータストリームであり、Open Flash Chart 2.0の付属例のdata-filesディレクトリの下のtxtテキストの内容と同様である)では、PHPを例に、JSONデータを出力する前に、
header("Content-Type:text/html;charset=utf-8");

三、一部の例のグラフのノードはtip内容を表示しない
Open Flash Char 2.0独自の例では、生成されたFlashチャートは、マウスをノードに移動してtip情報を表示せず、キャッシュ現象を排除した場合、それ自体の問題かもしれません.
......
"elements":[
 {
  "type":"line",
  "values":[<?php echo implode(',',$regUserCountArr);?>],
  "colour":"#ffae00",
  "text":"    ",
  "font-size":12,
  "tip":"    ,    values 。    :#val#  "
 },
......

上記のコードのtipプロパティのように、異なるノードの登録ユーザー数が表示されます.しかし、一部のグラフは表示されません.プロンプト情報をvaluesプロパティに統合してみると、問題は完璧に解決されます.
次にvaluesフォーマットを見てみましょう.
"values" :   [9,6,7,0,5,{"top":7,"colour":"#FF0000", "tip": "RED<br>Mooo<br>#val#"},6,9,7]

#val#は、現在のノードの値を表します.他にもこのような表現があり、自分で結果をテストすることができます.
上のvaluesプロパティのフォーマットは一目でわかります.すべてのノードにtipが表示されると、デフォルトの各値はカッコで囲まれたシーケンスのセットに変更され、{「プロパティ名」:値、「プロパティ名」:値...}です.
プレゼンテーションの例
当月1日あたりの登録ユーザー数を表示するとします
for($v=1; $v<=       ;$v++){
  $sql='...';
  $r=mysql_query($sql);
  $a[value]=           ;
  $a[tip]="    :#val#  ";
  $regUserCountArr[]=json_encode($a);
}
"elements":[
 {
  "type":"line",
  "values":[<?php echo implode(',',$regUserCountArr);?>],
  "colour":"#ffae00",
  "text":"    ",
  "font-size":12,
  "tip":"    ,  values 。"
 },

四、IE 6出現:Open Flash Chart IO ERROR Loading test data Error#2032エラー
IE 8、firefox、chrome、傲遊ブラウザなどのテストは正常ですが、IE 6で以上のエラーが発生し、Flashグラフを表示できません.解決策はJSONデータを出力する前にコード(PHP)を1行追加することです
header("Cache-Control: must-revalidate, post-check=0, pre-check=0");

Cache-Controlのmust-revalidate:ページをキャッシュしないように強制し、no-cacheと同じ役割を果たしますが、より厳しく、強制の意味がより明らかになります.詳細については、以下を参照してください.http://hi.baidu.com/chenleibupt/blog/item/9627bec6932e5a179c163df2.htmlpost-checkとpre-check:Internet Explorer 5は、HTTPヘッダ情報に対して、pre-checkとpost-checkの2つの新しい時間間隔指示を使用する.pre-check拡張子は、このような時間間隔を定義します.(秒で):つまり、この間隔の後、1つのオブジェクトがユーザーに表示される前に選択されて更新されます.選択されたオブジェクトは、そのオブジェクトがユーザーに表示された後でも発生しますが、ユーザーが次にこのオブジェクトを見たいときに、高速に保存されたコピーが更新されることを保証するために、post-check拡張子は、このような間隔を定義します.(秒で):この時間以降、ユーザーに表示される前に、オブジェクトが選択されて更新されます.post-check=0、pre-check=0はIE 5.0ならではのCache宣言です.参照先:1、http://bbs.chinaunix.net/thread-704320-1-1.html 2、http://blog.sina.com.cn/s/blog_5595d51401000b23.html
Pragma:no-cacheについてはCache-Control:no-cacheと同じです.Pragma:no-cache互換http 1.0,Cache-Control:no-cacheはhttp 1.1で提供されている.したがって、Pragma:no-cacheはhttp 1.0およびhttp 1.1に適用できるが、Cache-Control:no-cacheはhttp 1.1にのみ適用できる.
五、パラメータ伝達は1個を超えてはならない
var url='obj_data.php?a=1&b=2';
swfobject.embedSWF("open-flash-chart.swf","my_chart","100%","350","9.0.0","expressInstall.swf",{"data-file":url});

上obj_data.phpではパラメータaの値しか受信できず、パラメータbの値は受信できない.パラメータaとbを交換すると、bの値しか受信できず、aの値を受信できなくなる.簡単に言えば、最初のパラメータしか受信できず、1つのパラメータしか受信できません.したがって,複数のパラメータがあれば,URLパラメータで異なるパラメータ値を1シンボルで区切って受信プログラムでその文字列を分割抽出する.
六、その他の内容
公式の例:http://teethgrinder.co.uk/open-flash-chart/gallery-inner-bg.php
コンポーネントのダウンロード:http://download.csdn.net/detail/zm2714/4520118
この圧縮パッケージには、ASP環境とPHP環境ですべての例を自動的に抽出し、flashグラフを表示し、ユーザーが自分のプロジェクトに基づいて適切なflashグラフを選択するのに便利です.同時にswfobjectを修正する.jsファイルは、透明なflashをサポートし、技術的な手段でflash上の右クリック操作を遮断することができます.具体的な方法は、このブログの内容に注目してください.