初心者のFileMaker pro Q&A

みんなに優しく、解りやすくをモットーに開設しています。 以下のルールを守りみんなで助け合いましょう。

1.ファイルメーカーで解らない事があればここで質問して下さい。 何方でも、ご質問・ご回答お願いします。 (優しく回答しましょう)

ログインしていません。

アナウンス

Claris FileMaker Pro 19 ヘルプ
新しい質問は、新規トピック から投稿して下さい。


#1 2022-09-11 19:50:09

テラ
ゲストユーザー

WebビューアでJavaScriptを実行をプレビュー画面でも表示したい

Filemaker19で導入された「WebビューアでJavaScriptを実行」で連携が簡単になったようでQRコードを生成するjsを組み込んだのですが、プレビュー時や印刷時には表示されません。
手動でスクリプトを実行しても表示されないので何らかの設定が必要なのかと思うのですが、このスクリプトだとできないものなんでしょうか?

#2 2022-09-11 22:02:12

himadanee
ゲストユーザー

Re: WebビューアでJavaScriptを実行をプレビュー画面でも表示したい

Webビューアは、プレビューするときにリロードする仕様が変わってないようなので、プレビューや印刷は無理では?
例えばこのサイトで言えば、「検索」ボタンを押してからプレビューしても、元の画面をプレビューしてしまいます。
(低解像度になる問題はどうなったかな)

Javascriptを使うにしても、アドオンの「バーコードジェネレータ」は、生成したバーコードをオブジェクトフィールドに入れるようになってます。

#3 2022-09-12 00:20:47

テラ
ゲストユーザー

Re: WebビューアでJavaScriptを実行をプレビュー画面でも表示したい

himadaneeさん、ありがとうございます。
自分も画像にして格納しようかと考えました。

ただ、わざわざ格納するのもな...と思って更に調べた結果下記の方法のほうが簡単に実現できそうでした。
https://frudens.jp/filemaker-simple-qr-code-view/

置換しているだけなので広く使える方法ではないですが今回の場合コチラで対応できそうです。

一応解決していますが、他の方の意見も聞きたいのでもう少し解決済みにするは待ちます。

#4 2022-09-12 07:50:39

koko009
ゲストユーザー

Re: WebビューアでJavaScriptを実行をプレビュー画面でも表示したい

曖昧な情報で申し訳ないないですが。
「WebビューアでJavaScriptを実行」以前の方法で印刷に関し調べていたとき確かビューア表示される表示画像の大きさに関係してたと思う。かなり小さくすれば他のフィールドと共に全体(印刷ページに納まっているなら)を印刷できたような・・・最近物忘れがひどいので自信はない
どちらにしてもWebビューアだけならビューア部の右クリックで「開発者ツールで調査する」等が出るダイアログに印刷設定があるのでそこで印刷をすれば画像だけは印刷できる。但し解像度はWindowsの関係で固定されているらしい

#5 2022-09-13 13:42:21

koko009
ゲストユーザー

Re: WebビューアでJavaScriptを実行をプレビュー画面でも表示したい

過去にWebビューアを含む範囲をどうしても印刷したくて教えてもらいました。
https://fm-aid.com/bbs2/viewtopic.php?id=11445
これだとwebビューアで画像サイズが100%でもオブジェクトフィールドの大きさに合わせて表示できるから簡単にできるしページのレイアウトも自由・・・
そのままプレビュー、印刷とはならない方法ですが参考まで・・・

#6 2022-09-17 15:44:41

koko009
ゲストユーザー

Re: WebビューアでJavaScriptを実行をプレビュー画面でも表示したい

Webビューアのプレビュー問題と趣旨がズレていて申し訳ないですが、#5の場合かなりシチュエーションが違うので、試しにQRコードの生成をQRcode.js(かなり古いライブラリーらしい)を使ってコードの生成と画像化(今回はpngで)をしてみました。
テーブルには、読込用のテキストフィールドとと画像保存用のオブジェクトフィールド及びWebビューア
web アドレス
"<!DOCTYPE html>
<html>
<body>
<div id=\"qrcode\"></div>
<script type=\"text/javascript\" src=\"https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js\"></script>
<script type=\"text/javascript\">
function Qrcode(QRtext){
const qrcode = new QRCode(document.getElementById(\"qrcode\"), {
   text: JSON.parse(QRtext),
   width: 128,
   height: 128,
   render: 'canvas',
   colorDark : \"#ffffff\",
   colorLight : \"#000000\",
   correctLevel : QRCode.CorrectLevel.H
});
}
function imageDownload() {
const canvas = document.getElementsByTagName(\"canvas\")[0];
const image = canvas.toDataURL();
FileMaker.PerformScript(\"script01\", image);
}
</script>
</body>
</html>"

スクリプト1

    #スクリプトを連続して実行でビューアにコードが連続して描画されるのを防止
    Web ビューアの設定 [ オブジェクト名: "Web"; 処理: リセット ]
    #Web ビューアにQRコードを生成
    スクリプト一時停止/続行 [ 間隔(秒): .001 ]
    Web ビューアで JavaScript を実行 [ オブジェクト名: "Web"; 関数名: "Qrcode"; 引数 1: Quote (QR_image::text) ]
    #オブジェクトフィールドに画像としてコピー
    スクリプト一時停止/続行 [ 間隔(秒): .05 ]
    Web ビューアで JavaScript を実行 [ オブジェクト名: "Web"; 関数名: "imageDownload" ]
    現在のスクリプト終了 [ ]

スクリプト2・・・スクリプト名「script01」
    フィールド設定 [ QR_image::QR_image; Base64Decode (Substitute ( Get ( スクリプト引数 ) ; "data:image/png;base64,"; "" );"QR.png" ) ]

手近なライブラリーで作ったのであまり参考にならないと思う。

クィック投稿

メッセージを書いて送信してください。
登録の確認

実在の人物による登録であることを確認します。

Board footer