エクセルの表データをコピペするだけでブログ貼り付け可能なグラフを作る「ChartGizmo」、…

エクセルの表データをコピペするだけでブログ貼り付け可能なグラフを作る「ChartGizmo」

2008年10月13日 | sigeo | 4件 | カテゴリ クールなWEBサービス, 便利なWEBツール・サービス
スポンサードリンク

エクセルデータを貼り付けるだけでグラフコードを生成するchartgizmo

エクセルデータをコピペするだけ、つまりバイナリデータをそのまま貼り付けるだけでグラフを生成してくれる、アップロードするサービスも使い勝手が良いのですがこれもなかなかシンプルで便利ですよね。

エクセルデータをコピペするだけでグラフ貼り付けコードを生成

「エクセルシートに複数の表があって、アップロードするサービスではグラフを生成できない。 」、「だからといって、都度違うブックを新規作成するのも面倒。」

そんなときに便利なのがChartGizmo.comです。

カンタンなグラフ作成手順

1. エクセルから表データをコピー

実際にこのままコピーしてブラウザ上で貼り付けています。

2. コピーしたデータをブラウザ上で貼り付ける

エクセルのデータをこのように貼り付けると、画像左のように自動的にグラフチャートのデータテーブルが追加されます。

生成されるグラフのサンプル

ChartGizmoで生成できるグラフの貼り付け方法は下記の4通り。

1. Html

シンプルなイメージタグバージョン。

2. Dynamic

JavaScriptでグラフ画像を埋め込み。


3. Capture

JavaScriptでHTMLデータを生成するのですが、表示されないこともあるのが残念。

【2008-10-13 追記】
すみません、これはJavascriptの前にテーブルデータを書いておく必要があったようです。方法を以下に追記しておきます。
教えてくださったdemon101さん、ありがとうございます。
2008年3月 日本のウェブサイト利用者数ランキング
Yahoo! Sites44031
Google Sites34305
Rakuten Inc29344
Microsoft Sites29252
FC2 inc.27608
NTT Group27406
GMO Internet Group25225
Livedoor22740
Nifty Corporation22262
Wikipedia Sites21844

このように発行されるコードの前にテーブルデータを書いておくとグラフが生成されます。

テーブルデータのサンプル

以下のデータのように、 <table> の class を CSource とし、ラベルの列はひとつめを <td class="CLabels"> 数値の列は同じくひとつめを <td class="CValues"> と指定するとデータを読み込みます。

ちなみに <th> 要素を含めてしまうとデータが反映されないので注意してください。

4. Flash

Flashフォーマットでグラフを生成。 これが一番クールなグラフ。

興味のある方はChartGizmo.comへどうぞ。

実際に使ってみると、多数の表データがある際に、そのひとつだけをグラフ化してサイト上に公開したいときなどにかなり便利なのではないかと感じました。 パブリシティに市場調査データを利用する際には重宝するかも！？

Via:Delicious

スポンサードリンク

↓WEBマーケティングブログのGoogle+ページはじめました

おすすめの関連記事

この記事へのリンク生成

この記事へのリンクURL
この記事へのリンクタグ
表示サンプル：エクセルの表データをコピペするだけでブログ貼り付け可能なグラフを作る「ChartGizmo」 - WEBマーケティング ブログ
この記事へのリンクタグ(その２)
表示サンプル：エクセルの表データをコピペするだけでブログ貼り付け可能なグラフを作る「ChartGizmo」(WEBマーケティング ブログ)

“エクセルの表データをコピペするだけでブログ貼り付け可能なグラフを作る「ChartGizmo」”へのコメント4 つ

  • demon101: 2008年10月13日 18:03

    Hi,

    You wrote:

    JavaScriptでHTMLデータを生成するのですが、表示されないこともあるのが残念。

    Capture creates JavaScript allowing to collect the data from Html of your page. To use this feature the source data table should be marked with “CSource” table class and the table columns should be marked with the “CLabels” and “CValues” classes. The table should precede the JavaScript.

    I haven’t found the table on the page. That is why you have now data on the chart. =)


  • sigeo: 2008年10月13日 19:07

    Hi demon101.

    I added a postscript this post.

    Sorry, I don’t read caption closely.

    Thanks!（＾＾）v


  • demon101: 2008年10月13日 19:14

    Hi,

    Just for information: You can mark by class=”CLabels” class=”CValues” only in first row.

    P.S. Capture API is too complicated for users, but i have no time for good description.


  • sigeo: 2008年10月13日 19:43

    Hi, demon101.

    thanks. I modified “table”.

    And I’ll try Capture API.


コメントする