11

メールにグラフを表示したい-棒グラフ、面積グラフ、円グラフ。インラインスタイルのCSSベースのグラフをいくつか試しましたが、それでも表示されません。これは、チャートを電子メールで表示するための最良の方法です。

画像が唯一の選択肢ですか？

4

5 に答える 5

22

HTMLメールを単独で送信するのは難しい作業です。さまざまなメールクライアントのさまざまな標準と制限、およびセキュリティ制限の負荷により、ブラウザとクライアントをまたがるHTML電子メール配信の作成が困難になっています。経験則として、使用するテクノロジーが古いほど、メールクライアント間で均一に再現されると思います。「古い」テクノロジーとは、テーブル駆動型HTML、非常に基本的なCSS属性を持つインラインCSS、スクリプトなしなどを意味します。

電子メールのチャートの可能性：

  1. フラッシュチャート-これはほとんどすべてのメールクライアントによってブロックされます。
  2. HTML5チャート-ほとんどの電子メールクライアント（Webベースのものを含む）はSVGをブロックし、JavaScriptが確実にブロックされるため、「キャンバス」駆動のチャートを役に立たなくします。
  3. 純粋なHTMLチャートとCSSチャートは機能する可能性がありますが、最も一般的なチャートライブラリは高度なHTML機能を使用しているため、ほとんどのチャートは電子メール内で正常にレンダリングされません。
  4. 画像ベースのチャート-最善の策はチャートの画像です。インライン画像は電子メールクライアント間で広く送信されるため、グラフを画像として生成し、それをHTMLメールの一部として含めることをお勧めします。ほとんどのチャートコンポーネント（FusionCharts、Highchartsなど）では、チャートを画像として生成できます。

画像ベースのグラフを使用する予定でありながら動的に生成したい場合は、サーバーサイドスクリプトを作成することをお勧めします。このスクリプトにクエリ文字列を介してデータを送信すると、このデータを使用して生成されたチャート。

画像ベースのグラフの展開で問題が発生した場合は、単純なインラインCSSを使用してグラフを生成する純粋なHTMLベースのグラフを検討<table>し<div>てください。残念ながら、そのための市場にはすぐに利用できるコンポーネントはないと思います。

于 2012-06-03T10:18:45.237 に答える
4

免責事項：私はImage-Chartsの創設者です。

インディーハッカーとして、私は新しいSaaSを開始するたびにあなたと同じ質問をしました（画像生成バックエンドを最初から書き直してから、電子メールでグラフを送信します）。

そのため、Google画像検索のドロップイン置換を作成し、その上にgifアニメーション を追加しました（メールのグラフアニメーションは素晴らしいです!!）。

それは画像チャートと呼ばれます。サーバー側のグラフのレンダリングに苦労することも、スケーリングの問題もありません。非常に高速で、1つのURL=1つの画像グラフです。

ここに画像の説明を入力してください

ここに画像の説明を入力してください

ここに画像の説明を入力してください

ここに画像の説明を入力してください

于 2018-09-14T10:26:03.790 に答える
3

3.5年遅れましたが、最近、ラーメンの私のチームは、これを実行するスタンドアロン製品にいくつかの内部機能をスピンアウトしました：https ://ChartURL.com

「暗号化されたURL」スキームを使用してその場でグラフを生成するか、大量のデータを送信して、画像に解決される短縮URLを返すことができます。

無料枠がありますが、月に数百枚以上の画像を取得したら、支払いを開始するように求められます。ただし、価格設定をできるだけわかりやすくするように努めています。したがって、ユースケースがビジネスにとって重要である場合は、簡単なはずです。

これはhttp://C3js.orgの上に構築されているため、生成できるものには非常に柔軟性があります。

これらのURLはウェブアプリやモバイルアプリで使用できますが、元々の目的はメールチャートだったので、これがお役に立てば幸いです。

于 2015-11-25T03:12:34.783 に答える
0

Javascriptでグラフを作成することに慣れている場合、これらのグラフを大量に画像にレンダリングすることは、技術的に非常に複雑です。いくつかのレンダリングサービス（ヘッドレスブラウザやキャンバスの実装など）を選択し、多くのトラブルシューティングを行う必要があります。

私はこのプロセスを経て、データを取得し、電子メールに適した静止画像を生成するWebAPIであるオープンソースのQuickChartをリリースしました。ここでプロジェクトを見ることができます：https ：//github.com/typpo/quickchart

これは、Chart.jsAPIに基づいています。このようなチャート構成が与えられた場合：

{
  type: 'bar',
  data: {
    labels: [2012, 2013, 2014, 2015, 2016],
    datasets: [{
      label: 'Data',
      data: [12, 6, 5, 18, 12]
    }]
  }
}

URLに詰め込みます：https：//quickchart.io/chart？bkg = white＆c = {type：'bar'、data：{labels：[2012、2013、2014、2015、2016]、datasets：[{label： 'データ'、データ：[12、6、5、18、12]}]}}

そして、静止画像を返します：

メールのチャート画像

Quickchart.ioにはホストされた（これも無料の）バージョンがありますが、Dockerで自分で、またはソースから直接Webサービスを実行できます。

于 2019-12-07T17:20:55.803 に答える
-1

免責事項：私はChartyの創設者です

Chartyを使用してみることができます。これは、インタラクティブなグラフを数秒で作成し、25以上のグラフタイプがサポートされていました。

リンク：Charty

于 2018-10-01T13:11:49.577 に答える