0

単純な棒グラフのアイコンとして小さな四角形を使用した非常に単純な表を描画します。

http://jsfiddle.net/AbTX9/1/

ユーザーがテーブルをクリップボード (ドキュメント、スプレッドシートなど) にコピーできるようにしたいと考えています。

選択、コピー、貼り付けがテーブル内の数字に対してうまく機能し、それらを HTML として Excel、PPT、Word などにインテリジェントにコピーし、プレーン テキストとしてメモ帳/TextEdit にコピーする方法が気に入っています。

しかし、バーをコピーする方法もあるでしょうか? このようなHTMLテーブルとして貼り付けたり、対応するセルに形状を付けてExcelに貼り付けたりすることを頭の中で想像しています。私は3つの方法を試しました：

  • 区分:<div style="width: 100px; height: 10px; background-color:#AAA;"></div>
  • 画像:<img src="http://www.moneteam.com/images/BlueRectangle.jpg" height="12px" width="100px"/>
  • SVG :<rect x=80 y=10 width=100 height=12 fill="#A44"/>

Div と Img を使用すると、数値は表としてうまくコピーされますが、バーはコピーされません。SVG を使用すると、数字だけがコピーされますが、数字の行としてだけです。

誰かが私のためにそれをプログラムすることを期待せずに、主に実行可能なアプローチのヒントを探しています。それができない場合は、それも知っておくとよいでしょう。

私が見つけることができるほとんどのスレッドとは異なり、ctrl+C/cmd+C は問題なく、プログラムでクリップボードに配置する必要はありません。そして、最後のすべてのブラウザーで機能しない場合でも、問題はありません。

4

1 に答える 1

2

あなたはこれを試すことができます....

    <h1>Table with bars</h1>
<table style="width:250px; background-color: #EEE;">
<tr><td width="49">apples</td>
    <td colspan="4" bgcolor="#FF0000"></td>
    <td width="21"></td>
    <td width="41">100</td>
    </tr>
<tr><td>bananas</td>
    <td colspan="3" bgcolor="#FF0000"></td>
    <td width="31"></td>
    <td></td>
    <td>60</td></tr>
<tr><td>cherries</td>
    <td width="27" bgcolor="#FF0000">&nbsp;</td>
    <td width="24">&nbsp;</td>
    <td width="25">&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>36</td>
  </tr>
<tr><td>dates</td>
    <td colspan="3" bgcolor="#FF0000">&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>20</td>
  </tr>
</table>

あなたはそれを美しくするためにいくつかのcssプロパティを適用しようとすることができます:)

于 2012-09-11T13:53:21.833 に答える