javascript - JavaScriptを使ってGoogleマップの一部のスクリーンショットを撮る方法

Question

私のページには、Google Maps API を使用して地図を表示するコンテナがあり、その下にボタンがあり、ユーザーは地図を任意の位置にドラッグしてからボタンをクリックできます。地図のスクリーンショットを撮りたいですコンテナに表示され、キャンバスに表示されます。純粋な JavaScript でこれを行うことは可能ですか?

Chrome をサポートする必要があるだけです

Answer 1

ブラウザのサポートなしでは難しいでしょう。ただし、Google Static Maps API を使用できます: https://developers.google.com/maps/documentation/staticmaps/

例: https://developers.google.com/maps/documentation/staticmaps/#quick_example

---

HTML DOM をキャンバスに描画するプロジェクトがいくつかあります。

• HTML2Canvas: http://html2canvas.hertzen.com/index.html
• jsFeedback: http://hertzen.com/experiments/jsfeedback/

また、javascript をサーバー側のソリューション (webkit を使用) と統合することもできます (phantomjs など) 。

コード例: (詳細はこちら)

var page = require('webpage').create();

page.open('http://www.google.com', function() {

    page.viewportSize = {width: 1024, height: 768};
    page.render('screenshot.png');
    phantom.exit();
});

---

特定の範囲のユーザーに対して chrome ソリューションのみが必要な場合は、独自の chrome 拡張機能を記述して、これを行うことができます: