$(function() {

	$("#getcsv").on( "click", function(){

		var csv = "";

		$("table").find("th").each(function( index ){
			if ( index != 0 ) {
				csv += ",";
			}
			csv += '"' + $(this).text() + '"';
		});
		csv += "\n";

		var cnt = 0;
		$("table").find("tr").each( function(){

			// TH の最初の一行は処理しない )
			if ( cnt > 0 ) {

				$(this).find("td").each(function( col_cnt ){
					if ( col_cnt != 0 ) {
						csv += ",";
					}

					if ( col_cnt == 0 ) {
					// Excel で文字列をそのまま取り込めるように( 例. 0001 を文字列として扱う )
						csv += "=\"" + $(this).text() + "\"";
					}
					else {
						csv += "\"" + $(this).text() + "\"";
					}
				});
				csv += "\n";
			}

			cnt++;

		} );

		// UTF-8 の CSV を化けずに Excel で開く為
		var bom = new Uint8Array([0xEF, 0xBB, 0xBF]);
		saveAs(
			new Blob(
				[bom,csv]
				, {type: "text/csv;charset=" + document.characterSet}
			)
			, "syain.csv"
		);

	} );

});
PNG 保存


※ 表示タブを変更して非表示にするとアニメーションは停止します
Three.js によってアニメーションしています
	$("#getpng").on( "click", function(){
		$( $("#birds").get(0).contentWindow.document.body ).find("canvas").get(0).toBlob(function(blob) {
			saveAs(
				blob
				, "three_fly.png"
			);
		}, "image/png");
	} );


iframe 内の canvas に対して、jQuery でアクセスして toBlob メソッドを使用していますが、toBlob メソッドは、canvas-toBlob.js を iframe 内で読み込んで使用可能にしています。

※ saveAs メソッドは、FileSaver.js で実装されます




プラバシーポリシー