HTMLカラーブロックを使用して、データを動的に表示します
<スタイルタイプ/css> *{マージン：0;} {width：float：height：25px;} ：5％; 100％; <body> <div class = tubiao> <div class = jihua> <div class = left> plan </div> <！ - プランが保存される場所 - > <div class = right plan> </div> < /div> </div> <div class = shiji> <div class = left>実際の</div> <！ - 実際のスパン保存場所 - > <div class = right act> </div> </div> < div class> = riqi id = day_id> <！ - where the date store-> <div class = right day> </div> </div> </div> <script type = text/javascript> var temp1 = 0- 0.5 -2-2-2-1-1; 19-5/20-5/21-5/22-5/23-5/24-5/26-5/27-5/28; ; var plan.getelementsby（計画）[0] [0）]; Load_firsの多くのグリッド（//セグメントデータload_first（var demp.split）; - 消費計画（ブロック幅）アレイvar d2 = demo [1] .split（ - ）; （var i = 0; i <d3.length; i ++）{time_span（d3 [i]）;} // alert（6：+d1.length+------------ ----- +3：+d2.length）; [i]、d2 [i]、i）;} document.getElementbyId（day_id）.style.marginLeft = -30px;} //カラーブロックを追加します。Aはプランカラーブロックの幅、Bは実際のカラーブロックです幅function add_span（a、b、i）{// 0,255）+、+ rnd（0,255）+、+ rnd（0,255）+、+ rnd（0.5,1）+） // clientWidthはオブジェクトの幅（オブジェクトの幅（エッジラインなし、つまり境界線なし）span1.style.width =（plan.clientwidth/num*a） + px; //各幅の幅プランのグリッドプラン（SPAN1）を挿入します各グリッドのグリッドatt.appndchild（span2）;} else {// alert（a+b：+b+i：+i）; span1.style.width =（plan.clientwidth/num*a）+px; ; //クライアント装置は、オブジェクトの幅、境界線を除く） Plan.AppendChild（SPAN1）;} if（b == 0）{backgroundcolor = 000000; ACT.AppendChild（SPAN2）;} span2.Spa.Spa.width =（plan.ClientWidth/num*） （span2）;}} // function time_span（time）{// span block var span = document.createelement（span）; //各スパンの幅。innerhtml; day.app endchild（span）;} min）; ajax（type：post、url：test.aspx、dattype：{dispalystyle：displaystyle}、error：function（xmlhttprequest、textstatus、error thrown） 、成功：function（json）{try {load_first（json）;} catch（e）{}}}）;} // querydata（）;上記は、HTMLが編集者があなたにそれを紹介するカラーブロックの動的な表示を実現するレポート効果です。 Xiaobianは、すべての人に時間内に返信します。 VEVBウーリンのウェブサイトへのご支援ありがとうございます！