1. ホーム
  2. 質問と答え
  3. Chromeデベロッパーツールから時間グラフをエクスポートする方法はありますか？

Chromeデベロッパーツールから時間グラフをエクスポートする方法はありますか？

2011-01-10 17 views

答えて

1

これはまったく単純ではありませんが、十分に機能するようです。

  1. まずどこかの開発ツールと右クリック でタイムライン を取得し、「エレメントを点検」する必要があります。 これにより、別のバージョンの 開発ツールが開き、HTMLが利用できます。

  2. タグを右クリックし、「HTMLとしてコピー」を選択すると、 をコピーする必要があります。

  3. これをテキストエディタに貼り付け、htmlファイルとして保存します。

  4. Chromeで次のURLを表示し、これらのファイルをhtmlファイルと同じ場所に保存します。保存されたHTMLで<head>タグ内の位置 chrome-devtools://devtools/DevTools.js chrome-devtools://devtools/devTools.css

  5. の変更は、これらのファイルを指すように。

  6. リソースタブのすべてのイメージを、このファイルがある場所の「Images」フォルダに保存します。これは、年齢がかかる、申し訳ありません！これらはすべてChromesのインストールディレクトリにあるChromeの "resources.pak"ファイルに含まれていると思いますが、簡単な方法では解凍できませんでした。

  7. ブラウザでHTMLを表示すると、必要な情報が表示されます。もちろん、リソース、js、cssを抽出したら、異なるバージョンのタイムラインをコピーして異なるHTMLファイルに貼り付けることができます。

出典

2011-04-21 12:20:34 bjammin666

+0

Ubuntu 12でバージョン23.0.1271.97（私はこのバージョンのみをテストしました）のDev Tools Elementを検査することはできなくなりました。04 :( –

+0

あなたはまだコンテキストメニューの代わりにchrome：// inspectページを使用するだけのdevツールを調べることができます： http://stackoverflow.com/questions/12291138/how-do-you-inspect- Web-Inspector-in-chrome/13568896＃13568896 –

24

あなたはnetworkパネル内の滝グラフ出力を参照していると仮定すると、あなたは、チャートのヘッダーを右クリック（またはチャート自体の空のスペース）、およびとして「コピーネットワークログを選択することができますHAR "を押してチャートのデータをクリップボードに取り込みます。

HARは、多くのツールが理解できる形式です。あなたのクライアントと話し合う素晴らしいウォーターフォールチャートを生成するには、HAR Viewerのようなものを見てください。私はあなたのニーズを満たすだろうと思う。

出典

2011-04-22 14:51:17

+0

こんにちはMike、HAR Viewerが私が貼り付けるログを鳴らしています。これは私が使用しているChromeのバージョンやHAR Viewerのバージョンに固有のものです。 –

+1

こんにちはGabrielさん、HARサポートにいくつかのバグがあり、修正作業中です.HAR Viewerに検証をスキップするように指示した場合（それはチェックボックスです）、ログファイルの大部分は正確に表示されます。欠落しているフィールドは、将来のリリースでラップアップする必要がありますが、現時点ではこれが唯一の回避策です。 –

+0

面白いことは私ですValidaに関係なく、HARビューアでログが機能しないしかし、私が他人から郵送で受け取ったもののいくつかはあります。だから私は大丈夫です。 –

0

ネットワークパネル上のデータをすばやく簡単に取得するには、表示されたデータの行を右クリックし、すべてを選択してExcelにコピーして貼り付けます。

Excelは実際にデータの表形式のレイアウトをキャプチャし、Excelで一度必要に応じてデータを操作できます。

1つの欠点は、Chromeで作成されたすっきりとしたウォーターフォールグラフをキャプチャしないことですが、Excelのグラフ機能でそれを補うことができると思います！

出典

2011-09-06 05:02:02 Fergal

+1

すべてを選択すると、実際には表示されている行のみが選択されます。 –

関連する問題

 関連する問題