JP7612433B2 - Information processing device, information processing method, and program - Google Patents
Information processing device, information processing method, and program Download PDFInfo
- Publication number
- JP7612433B2 JP7612433B2 JP2021009332A JP2021009332A JP7612433B2 JP 7612433 B2 JP7612433 B2 JP 7612433B2 JP 2021009332 A JP2021009332 A JP 2021009332A JP 2021009332 A JP2021009332 A JP 2021009332A JP 7612433 B2 JP7612433 B2 JP 7612433B2
- Authority
- JP
- Japan
- Prior art keywords
- area
- web page
- display
- display area
- content
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Images
Landscapes
- User Interface Of Digital Computer (AREA)
Description
本発明は、情報処理装置、情報処理方法、及びプログラムに関する。 The present invention relates to an information processing device, an information processing method, and a program.
スマートフォン、タブレット端末などの携帯機器にもＷｅｂブラウザが搭載され、携帯機器でのＷｅｂブラウザを用いたＷｅｂページの閲覧が一般的に行われている。ユーザがＷｅｂブラウザに対してＷｅｂページのＵＲＬを指定すると、Ｗｅｂブラウザは指定されたＵＲＬにアクセスしてＨＴＭＬ文書等のＷｅｂコンテンツを取得し、Ｗｅｂページを表示する。ＨＴＭＬ文書の描画結果はＷｅｂブラウザの表示領域を超えるサイズになることもある。その場合、スマートフォンやタブレットのＷｅｂブラウザでは、ドラッグやスワイプ等のユーザ操作によりスクロールすることでＷｅｂページの所望の表示範囲を閲覧することができる。 Mobile devices such as smartphones and tablet terminals are also equipped with web browsers, and it is common to view web pages using the web browsers on mobile devices. When a user specifies the URL of a web page to the web browser, the web browser accesses the specified URL, obtains web content such as an HTML document, and displays the web page. The resulting HTML document may be larger than the display area of the web browser. In such cases, the web browser on the smartphone or tablet allows the user to scroll by dragging, swiping, or other user operations to view the desired display range of the web page.
しかし、ドラッグやスワイプをする位置によってはＷｅｂページのスクロールが実行されない場合がある。Ｗｅｂページは“ｉｆｒａｍｅ”、“ｉｍｇ”、“ｃａｎｖａｓ”等のタグにより、他のＨＴＭＬ文書、画像、図形等を埋め込んで表示し、ＪａｖａＳｃｒｉｐｔ（登録商標）でそのコンテンツに対するユーザ操作を規定することができる。本明細書では、これらのコンテンツを、ベースになるＨＴＭＬ文書に対する内部コンテンツとも呼ぶ。ドラッグやスワイプに対する動作を規定している内部コンテンツの表示領域でドラッグやスワイプをすると、Ｗｅｂページに対する操作ではなく内部コンテンツに対する操作として認識される。例えば、地図を提供する外部サイトが内部コンテンツとしてＨＴＭＬ文書に埋め込まれている場合、地図上でスワイプやドラッグをするとＷｅｂページのスクロールは実行されずに、地図上の表示位置を変える処理になる。 However, depending on the position where the drag or swipe is performed, the web page may not scroll. A web page can display other HTML documents, images, figures, etc. embedded using tags such as "iframe", "img", and "canvas", and user operations on that content can be specified using JavaScript (registered trademark). In this specification, these contents are also referred to as internal content for the base HTML document. When dragging or swiping is performed in the display area of the internal content that specifies the actions for dragging or swiping, it is recognized as an operation on the internal content, not an operation on the web page. For example, if an external site that provides a map is embedded in the HTML document as internal content, swiping or dragging on the map will not scroll the web page, but will result in a process of changing the display position on the map.
内部コンテンツがＷｅｂブラウザの表示領域の大部分を占める場合、Ｗｅｂページのスクロールが困難になることがある。ドラッグによってスクロールする場合、ドラッグを離した位置にＷｅｂページをスクロールさせるための領域がある。しかし、慣性スクロールのように、ユーザの指が離れてもスクロールが継続する場合、スクロール後のＷｅｂブラウザの表示領域が内部コンテンツにより覆われる状態になることがあった。この状態におけるスワイプやドラッグは内部コンテンツへの操作として扱われるため、Ｗｅｂページのスクロールが困難になる。それに対する方法として、Ｗｅｂページ上の内部コンテンツの操作を無効化し、内部コンテンツは別画面、例えばブラウザの別タブで表示して内部コンテンツの操作は別タブの方で受け付けるという技術が提案されている（特許文献１）。 When the internal content occupies most of the display area of the web browser, it can become difficult to scroll the web page. When scrolling by dragging, there is an area for scrolling the web page to the position where the drag is released. However, when scrolling continues even after the user's finger is released, as in inertial scrolling, the display area of the web browser after scrolling can become covered by the internal content. In this state, swiping or dragging is treated as an operation on the internal content, making it difficult to scroll the web page. As a solution to this problem, a technology has been proposed that disables operations on the internal content on the web page and displays the internal content on a separate screen, for example, in a separate tab of the browser, and accepts operations on the internal content in the separate tab (Patent Document 1).
しかしながら、特許文献１に記載の技術のように内部コンテンツを別タブで表示すると、１つのＷｅｂページを複数のタブで扱うことにより、ユーザの利便性が低下することがある。例えば、ユーザが複数のタブを切り替える操作が増えたり、タブの数に制限があり上限数利用している場合には既に別のＷｅｂページを表示していたタブの表示が内部コンテンツ表示で更新されてしまったりする。
However, when internal content is displayed in a separate tab as in the technology described in
本発明は、このような事情に鑑みてなされたものであり、ユーザの利便性を低下させることなく、ユーザがＷｅｂページをスクロール可能なようにＷｅｂページを表示できるようにすることを目的とする。 The present invention has been made in consideration of these circumstances, and aims to enable a user to display a web page in a manner that allows the user to scroll the web page without reducing user convenience.
本発明に係る情報処理装置は、指示操作の入力を受付けるコンテンツを有するＷｅｂページを、タッチ操作により指示操作の入力を受付ける表示部に表示させる表示制御手段と、前記Ｗｅｂページの前記コンテンツを含む領域を前記表示部に表示させる場合、前記コンテンツを示す領域とは異なり、該Ｗｅｂページをスクロールするための操作領域を所定以上のサイズとするよう前記表示部における前記Ｗｅｂページの表示を制御する制御手段と、前記Ｗｅｂページのユーザ操作に応じた前記表示部における表示領域であって、前記Ｗｅｂページの第１の表示領域が所定の条件を満たすか否かを判定する判定手段とを有し、前記判定手段は、前記第１の表示領域における前記コンテンツを示す領域に基づいて、前記第１の表示領域において前記操作領域が所定以上のサイズとなるか否かを判定し、前記制御手段は、前記第１の表示領域では前記操作領域が前記所定以上のサイズにならない場合、前記所定以上のサイズの前記操作領域を含む第２の表示領域で前記Ｗｅｂページを表示するよう制御することを特徴とする。 The information processing device of the present invention comprises a display control means for displaying a web page having content that accepts input of instruction operations on a display unit that accepts input of instruction operations by touch operations, a control means for controlling the display of the web page on the display unit so that, when an area including the content of the web page is displayed on the display unit, an operation area for scrolling the web page is a predetermined size or larger, different from the area showing the content, and a determination means for determining whether a first display area of the web page, which is a display area on the display unit in response to a user operation of the web page, satisfies a predetermined condition, wherein the determination means determines whether the operation area in the first display area will be a predetermined size or larger based on the area showing the content in the first display area, and the control means controls to display the web page in a second display area including the operation area of the predetermined size or larger if the operation area in the first display area does not have the predetermined size or larger .
本発明によれば、ユーザの利便性を低下させることなく、ユーザがＷｅｂページをスクロール可能なようにＷｅｂページを表示することができる。 According to the present invention, a web page can be displayed so that the user can scroll the web page without reducing user convenience.
以下、本発明の実施形態を図面に基づいて説明する。なお、以下に説明する実施形態は、特許請求の範囲に関わる本発明を限定するものではなく、また、本実施形態で説明されている特徴の組み合わせてのすべてが本発明の解決手段に必須のものとは限らない。なお、同一な構成については、同じ符号を付して説明する。 The following describes an embodiment of the present invention with reference to the drawings. Note that the embodiment described below does not limit the present invention as it relates to the scope of the claims, and not all of the combinations of features described in the present embodiment are necessarily essential to the solution of the present invention. Note that the same components are described with the same reference numerals.
図１は、本発明の一実施形態における情報処理装置のハードウェア構成例を示すブロック図である。本実施形態における情報処理装置１００は、コントローラ部１１０、操作部１２０、表示部１３０、記憶部１４０、及び通信部１５０を有する。
FIG. 1 is a block diagram showing an example of the hardware configuration of an information processing device according to one embodiment of the present invention. The
コントローラ部１１０は、情報処理装置全体の制御を司る。コントローラ部１１０は、ＣＰＵ（Central Processing Unit）１１１、ＲＯＭ（Read Only Memory）１１２、及びＲＡＭ（Random Access Memory）１１３を有する。ＣＰＵ１１１は、情報処理装置１００における各処理部の処理を実行する。ＲＯＭ１１２には、ＣＰＵ１１１が実行する各種プログラムや、プログラムを実行する際に必要とするデータ等が記憶されている。ＲＡＭ１１３は、例えばＳＲＡＭ、ＤＲＡＭ等で構成され、プログラム制御変数等を格納するためのものである。また、各種ワーク用バッファもＲＡＭ１１３に格納される。
The
操作部１２０は、キーボード、タッチパネル、マウス等で構成され、ユーザが各種入力操作を行うためのものである。表示部１３０は、ＬＣＤ、ＬＥＤディスプレイ等でユーザに表示通知するためのものである。記憶部１４０は、ハードディスク等で構成され、文書や画像等のファイルデータを格納するためのものである。通信部１５０は、ネットワークに接続するためのインタフェースである。接続方法としてはＬＡＮ、無線ＬＡＮ等がある。
The
本実施形態における情報処理装置１００は、例えばＵＲＬ（Uniform Resource Locator）で指定されたＷｅｂページにアクセスし、Ｗｅｂコンテンツを取得、解釈して描画するＷｅｂブラウザのプログラムを実行する。Ｗｅｂコンテンツは、ＨＴＭＬ文書（ＨＴＭＬファイル）、ＪａｖａＳｃｒｉｐｔ（登録商標）、ＣＳＳスタイルシート等を含む。ＷｅｂブラウザのプログラムはＲＯＭ１１２もしくは記憶部１４０に格納され、ＲＡＭ１１３に読み出してＣＰＵ１１１が処理を実行する。Ｗｅｂブラウザを構成するＧＵＩやＷｅｂコンテンツは表示部１３０に描画され、操作部１２０からの入力に伴いユーザからの指示を受付ける。ネットワーク経由でＷｅｂコンテンツを取得する場合、通信部１５０を介して処理される。
In this embodiment, the
図２は、本実施形態における情報処理装置１００の機能構成例を模式的に示すブロック図である。情報処理装置１００は、表示制御部２０１、判定部２０２、及び制御部２０３を有する。なお、各部はＲＯＭ１１２に保存されたプログラムによって制御される。
FIG. 2 is a block diagram showing a schematic example of the functional configuration of the
表示制御部２０１は、Ｗｅｂページを表示部１３０に表示する処理を行う。表示制御部２０１は、操作部１２０の入力により指定されたＵＲＬに通信部１５０を介してアクセスして得られた、ＨＴＭＬ文書、ＣＳＳスタイルシート、ＪａｖａＳｃｒｉｐｔ等のＷｅｂコンテンツから描画結果を生成してＷｅｂブラウザに表示する。図３に、Ｗｅｂブラウザがコンテンツを解析する流れを示す。ＨＴＭＬパーサ３０２は、ＨＴＭＬ文書３０１の構文解析を行い、ＤＯＭツリー３０３を生成する。ＣＳＳパーサ３０５は、ＣＳＳスタイルシート３０４の構文解析を行い、ＨＴＭＬ文書３０１の装飾情報であるスタイルルールをツリー表現したＣＳＳＯＭツリー３０６を生成する。次に、ＤＯＭツリー３０３とＣＳＳＯＭツリー３０６をもとにＤＯＭツリー３０３に視覚的な表現を取り入れたレンダーツリー３０７を生成する。そして、レンダーツリー３０７の描画情報をもとに、各ＨＴＭＬ文書に含まれるコンテンツの配置を決定するレイアウト処理３０８を行う。次に、レイアウト処理３０８を行ったレンダーツリー３０７を、Ｗｅｂブラウザの画面表示に用いるバッファ領域であるサーフェスに描画することによって、描画結果（Ｗｅｂページ）を表示する（描画３０９）。また、表示制御部２０１は、Ｗｅｂページの表示において、ＨＴＭＬ文書が含む各要素の描画位置の座標を管理する。
The
また、表示制御部２０１は、描画結果の表示領域の制御を行う。表示制御部２０１は、操作部１２０であるタッチパネルからＷｅｂページに対するドラッグの入力があると、ドラッグした方向及び移動量に従って、Ｗｅｂブラウザに表示する描画結果の表示領域を変更する。また、表示制御部２０１は、操作部１２０からの入力がスワイプである場合には、ユーザによるタッチパネルへの接触（タッチ）が離れた後もスクロールが続くように描画結果の表示領域を変更する。表示制御部２０１は、スワイプの操作速度を取得して、速度に応じて表示領域をスワイプ方向に逐次変更し、徐々に表示領域の移動量を少なくしていき、最終的に移動量を０にして表示領域を決定する。
The
判定部２０２は、表示制御部２０１が決定しようとする表示領域内にＷｅｂページをスクロールするための操作領域が所定以上のサイズで含まれているか否かを判定する。Ｗｅｂページをスクロールするための操作領域とは、Ｗｅｂページをスクロールするための操作、ここではドラックやスワイプに対してＪａｖａＳｃｒｉｐｔ等でＷｅｂページのスクロール以外の別の処理が割り当てられていない領域のことである。別の処理が割り当てられている部分でドラッグやスワイプをしてもＷｅｂページのスクロールは発生しない。判定部２０２は、Ｗｅｂページをスクロールするための操作領域を所定以上含んでいる場合、その表示位置に表示領域を決定すると判定する。また、判定部２０２は、Ｗｅｂページをスクロールするための操作領域が所定サイズよりも小さい場合、表示領域の変更が必要であると判定する。
The
制御部２０３は、判定部２０２が表示領域の変更が必要であると判定した場合に、表示領域にＷｅｂページをスクロールするための操作領域を所定以上含むように表示領域を変更する、移動方向及び移動量を算出する。算出された移動方向及び移動量は、表示制御部２０１に伝達され、表示制御部２０１は、指定された移動方向及び移動量をもとにして、描画結果中の表示領域を変更する。
When the
図４は、Ｗｅｂブラウザが読み込むＷｅｂコンテンツの例を示す図である。図４（Ａ）はＨＴＭＬ文書の例を示し、図４（Ｂ）はＣＳＳスタイルシートの例を示し、図４（Ｃ）はＪａｖａＳｃｒｉｐｔの例を示している。 Figure 4 shows examples of web content that a web browser loads. Figure 4(A) shows an example of an HTML document, Figure 4(B) shows an example of a CSS style sheet, and Figure 4(C) shows an example of JavaScript.
図４（Ａ）に示すＨＴＭＬ文書４００は、ＨＴＭＬの見出しの要素である＜ｈ１＞要素、＜ｈ２＞要素、箇条書きを示す＜ｌｉ＞要素（４０１）、内部コンテンツとして＜ｃａｎｖａｓ＞要素（４０２）、及び＜ｉｆｒａｍｅ＞要素（４０３）を有する例である。内部コンテンツの＜ｃａｎｖａｓ＞要素（４０２）、及び＜ｉｆｒａｍｅ＞要素（４０３）は指示操作の入力を受付けるコンテンツの一例である。＜ｃａｎｖａｓ＞要素（４０２）は、後述する図４（Ｃ）に示すＪａｖａＳｃｒｉｐｔで動作を規定されている。＜ｉｆｒａｍｅ＞要素（４０３）は、ｓｒｃ属性で指定されたコンテンツをＷｅｂページに埋め込んで表示する。本例では、外部の地図サービスが提供する地図を埋め込んで表示している例とする。地図を提供するＷｅｂサービスは一般的に存在し、そのような地図サービスでは指定した地図の範囲を他のＷｅｂサイトで埋め込み表示できるようにしている。指定した地域を表示するためのＨＴＭＬ要素をＷｅｂページに含ませることで、外部の地図サービスが提供する地図をＷｅｂページに埋め込むことができる。＜ｉｆｒａｍｅ＞要素や＜ｓｃｒｉｐｔ＞要素などで埋め込む。ここでは、＜ｉｆｒａｍｅ＞要素（４０３）で地図の表示を埋め込むものとする。Ｗｅｂブラウザで表示された地図上でスワイプすると表示している地図の緯度や経度を変更することができ、ピンチイン、ピンチアウトで地図の拡大／縮小の操作をすることができる。
The
図４（Ｂ）に示すＣＳＳスタイルシート４１０は、＜ｈ１＞要素に対する装飾を示しており、横幅３００ｐｘ（ピクセル）、高さ５０ｐｘの矩形を３ｐｘの破線で囲んだ矩形で装飾することを示している。
The
図４（Ｃ）に示すＪａｖａＳｃｒｉｐｔ４２０は、ＨＴＭＬ文書４００に含まれている＜ｃａｎｖａｓ＞要素（４０２）に対する動作を規定したＪａｖａＳｃｒｉｐｔの例である。ｗｉｎｄｏｗ．ｏｎｌｏａｄに対する関数（４２１）、ｔｏｕｃｈｓｔａｒｔイベントに対する関数（４２２）、ｔｏｕｃｈｍｏｖｅイベントに対する関数（４２３）、ｔｏｕｃｈｅｎｄイベントに対する関数（４２４）を定義している。ｔｏｕｃｈｓｔａｒｔイベントは、操作部１２０及び表示部１３０として機能し、タッチ操作により指示操作の入力を受付けるタッチパネル上で、動作を規定する領域に対してユーザの指等の接触が開始されたときに発生するイベントである。また、ｔｏｕｃｈｍｏｖｅイベントは、操作部１２０及び表示部１３０として機能し、タッチ操作により指示操作の入力を受付けるタッチパネル上で、動作を規定する領域に対してユーザの指等が接触中に発生するイベントである。ｔｏｕｃｈｅｎｄイベントは、操作部１２０及び表示部１３０として機能し、タッチ操作により指示操作の入力を受付けるタッチパネル上で、動作を規定する領域に対してユーザの指等の接触が終了されたときに発生するイベントである。
ｗｉｎｄｏｗ．ｏｎｌｏａｄに対する関数（４２１）では、ｉｄが“ｃａｎｖａｓ１”である＜ｃａｎｖａｓ＞要素において各操作が発生した場合に実行する関数をａｄｄＥｖｅｎｔＬｉｓｔｅｎｅｒ登録している。この例では、ｔｏｕｃｈｓｔａｒｔ、ｔｏｕｃｈｍｏｖｅ、ｔｏｕｃｈｅｎｄに対応する操作が発生した場合に実行する関数をａｄｄＥｖｅｎｔＬｉｓｔｅｎｅｒ登録している。また、＜ｃａｎｖａｓ＞要素の領域に描画するための２次元コンテキストを取得している。スワイプやドラッグが行われると、ｔｏｕｃｈｓｔａｒｔ、ｔｏｕｃｈｍｏｖｅ、ｔｏｕｃｈｅｎｄなどのイベントが発行される。そのため、＜ｃａｎｖａｓ＞要素の描画領域でユーザがスワイプやドラッグを行うと、＜ｃａｎｖａｓ＞要素をターゲットにしてイベントが発行され、各イベントに対する関数が呼び出されて、関数に定義された処理が実行される。 In the function (421) for window.onload, the function to be executed when each operation occurs in the <canvas> element with id "canvas1" is registered in addEventListener. In this example, the function to be executed when the operations corresponding to touchstart, touchmove, and touchend occur is registered in addEventListener. In addition, a two-dimensional context for drawing in the area of the <canvas> element is obtained. When a swipe or drag is performed, events such as touchstart, touchmove, and touchend are issued. Therefore, when a user swipes or drags in the drawing area of the <canvas> element, an event is issued with the <canvas> element as the target, a function for each event is called, and the processing defined in the function is executed.
ｔｏｕｃｈｓｔａｒｔイベントに対する関数（４２２）では、ｔｏｕｃｈｓｔａｒｔが発生した座標の取得と、ｔｏｕｃｈｓｔａｒｔした状態を保存するためのフラグ（ｆｌａｇ）へｔｒｕｅを代入している。 The function (422) for the touchstart event gets the coordinates where touchstart occurred and assigns true to a flag to save the touchstart state.
ｔｏｕｃｈｍｏｖｅイベントに対する関数（４２３）では、２次元コンテキスト内の座標としてｔｏｕｃｈｍｏｖｅの座標を取得する。そして、ｍｏｖｅＴｏ、ｌｉｎｅＴｏ、ｓｔｒｏｋｅの各関数にて、ｔｏｕｃｈｓｔａｒｔした座標もしくは、前回ｔｏｕｃｈｍｏｖｅした座標との間に線を描いている。 The function (423) for the touchmove event obtains the coordinates of the touchmove as coordinates in the 2D context. Then, the moveTo, lineTo, and stroke functions draw a line between the touchstart coordinates or the previous touchmove coordinates.
ｔｏｕｃｈｅｎｄイベントに対する関数（４２４）では、描画が終了したことを保持するため、フラグ（ｆｌａｇ）にｆａｌｓｅを代入している。 The function (424) for the touchend event assigns false to the flag to indicate that drawing has finished.
図５は、図４（Ａ）に示したＨＴＭＬ文書４００、図４（Ｂ）に示したＣＳＳスタイルシート４１０、及び図４（Ｃ）に示したＪａｖａＳｃｒｉｐｔ４２０に基づいてＷｅｂページを描画した結果を示している。
Figure 5 shows the result of rendering a web page based on the
５００はＨＴＭＬ文書全体を描画した描画結果である。図４（Ａ）に示した＜ｈ１＞要素、＜ｈ２＞要素、及び＜ｌｉ＞要素（４０１）を描画した部分が５０１であり、＜ｈ１＞要素の「Ｗｅｂ ｐａｇｅ」が図４（Ｂ）に示したＣＳＳスタイルシートに従い破線で囲まれた表示になる。＜ｌｉ＞で囲まれたテキスト、「Ｓａｍｐｌｅ１」、「Ｓａｍｐｌｅ２」は箇条書きとして表示される。５０２は図４（Ａ）に示した＜ｃａｎｖａｓ＞要素（４０２）の描画結果であり、属性値であるｗｉｄｔｈ及びｈｅｉｇｈｔで指定されたサイズで描画されている。５０３は図４（Ａ）に示した＜ｉｆｒａｍｅ＞要素（４０３）の描画結果であり、同じく＜ｉｆｒａｍｅ＞要素の属性値であるｗｉｄｔｈ及びｈｅｉｇｈｔで指定されたサイズで描画されている。 500 is the rendering result of rendering the entire HTML document. 501 is the portion where the <h1> element, <h2> element, and <li> element (401) shown in FIG. 4A are rendered, and the <h1> element's "Web page" is displayed surrounded by a dashed line according to the CSS style sheet shown in FIG. 4B. The text surrounded by <li>, "Sample1" and "Sample2", are displayed as bullet points. 502 is the rendering result of the <canvas> element (402) shown in FIG. 4A, which is rendered at a size specified by the attribute values width and height. 503 is the rendering result of the <iframe> element (403) shown in FIG. 4A, which is also rendered at a size specified by the attribute values width and height of the <iframe> element.
領域５０４は描画結果の中でＷｅｂブラウザに表示する領域（ある時点においてユーザが視認可能な表示領域）を示している。描画結果の中で表示する表示範囲は変更可能となっており、表示制御部２０１は、描画結果内の表示領域５０４を変更することでＷｅｂページのスクロールを表現する。例えば、ユーザが表示領域５０４にて上方向にスワイプすると、表示制御部２０１は、スワイプの移動量や加速度に応じて、下方向にスクロールするように表示領域を変更する。例えば、図５（Ｂ）に示すように最終的に領域５１１の位置に表示領域を定めると、＜ｌｉ＞要素を描画した箇条書き表示した状態でスクロールが止まったように表現することができる。
表示領域が領域５１１である場合、＜ｃａｎｖａｓ＞要素の描画部分５０２以外の表示領域でスワイプすると、更にスクロールすることができる。しかしながら、＜ｃａｎｖａｓ＞要素の描画部分５０２でスワイプをすると、図４（Ｃ）に示したＪａｖａＳｃｒｉｐｔで規定されているように線を描画する操作として解釈するためにＷｅｂページのスクロールをすることはできない。表示領域が領域５１２である場合、＜ｃａｎｖａｓ＞要素の描画部分５０２の下端から＜ｉｆｒａｍｅ＞要素の描画部分５０３の上端までの部分にスワイプをする領域があれば、スワイプ等をすることによりＷｅｂページをスクロールすることができる。一方で、スワイプする領域がなければ、Ｗｅｂページをスクロールすることができない。同じく、表示領域が領域５１３である場合、＜ｉｆｒａｍｅ＞要素の描画部分５０３の下端から表示領域の下端までの部分にスワイプをする領域がなければ、Ｗｅｂページのスクロールができない状態になる。本実施形態では、Ｗｅｂページをスクロールすることができる領域を表示領域に含めて表示することによって、常にユーザがＷｅｂページをスクロールできるようにし、Ｗｅｂページのスクロールができない状態になることを回避する。
When the display area is
図６は、図５（Ａ）に示した描画結果（Ｗｅｂページ）５００において、スクロールした結果として、通常表示される表示領域（図６（Ａ）、図６（Ｃ））と本実施形態による最終的な表示領域（図６（Ｂ）、図６（Ｄ））を説明する図である。 Figure 6 is a diagram illustrating the display area that is normally displayed (Figures 6(A) and 6(C)) and the final display area according to this embodiment (Figures 6(B) and 6(D)) as a result of scrolling the rendering result (web page) 500 shown in Figure 5(A).
図６（Ａ）に示す例において、表示領域６０１は、ほとんどが＜ｃａｎｖａｓ＞要素の描画部分５０２に覆われており、Ｗｅｂページをスクロールすることが困難な状態にある。慣性スクロールした結果、このような表示領域６０１となって表示されることがある。例えば、図５（Ａ）に示した表示領域５０４内で上方向にスワイプすると、そのスワイプの速度に応じて慣性スクロールが開始される。そして、最終的に徐々に速度が落ちるように表示領域の変位が小さくなり、スワイプをする領域をほとんど持たない表示領域６０１で描画結果が表示されることがある。この状態において、更にＷｅｂページのスクロールをするのは困難である。＜ｃａｎｖａｓ＞要素の描画部分５０２でスワイプをすると、＜ｃａｎｖａｓ＞要素に割り当てられた別の操作が実行される。本実施形態では、＜ｃａｎｖａｓ＞要素に対してｔｏｕｃｈｓｔａｒｔ、ｔｏｕｃｈｍｏｖｅ、ｔｏｕｃｈｅｎｄイベントが発行されて＜ｃａｎｖａｓ＞要素の描画部分５０２に線を描画する処理が実行される。何度スワイプをしても線を描画する指示にしかならないため、Ｗｅｂページをスクロールするためには＜ｃａｎｖａｓ＞要素の描画部分５０２以外の領域でスワイプをする必要がある。しかしながら、表示領域６０１の上端から＜ｃａｎｖａｓ＞要素の描画部分５０２の上端の間の範囲は狭くてスワイプをすることができないため、Ｗｅｂページをスクロールすることができない。
In the example shown in FIG. 6A, most of the
そこで、本実施形態では、例えばＷｅｂページをスクロールするためにスワイプをすることができる領域を含むように表示領域を制御する。情報処理装置１００は、Ｗｅｂページのスクロールを停止する位置の表示領域の状態を解析し、表示領域内にＷｅｂページに対する操作が行える所定のサイズ（高さ×幅）の領域が存在するか否かを判定する。表示領域内にＷｅｂページに対する操作が行える所定のサイズ（高さ×幅）の領域が存在しないと判定した場合、Ｗｅｂページをスクロールするためにスワイプできる所定のサイズの領域が確保される位置に表示領域を補正する。
Therefore, in this embodiment, the display area is controlled to include an area where, for example, a swipe can be used to scroll a web page. The
図６（Ａ）に示した例の場合、情報処理装置１００は、表示領域を上方または下方に移動することにより＜ｃａｎｖａｓ＞要素の描画部分５０２の上部または下部にＷｅｂページをスワイプする領域を含んだ状態にすることができる。少ない補正量でＷｅｂページをスワイプする領域を確保するのであれば、図６（Ｂ）に示すように表示領域６０２を上方に補正し、＜ｃａｎｖａｓ＞要素の描画部分５０２の上部にＷｅｂページをスワイプ可能な領域が含まれる位置に表示領域を決定する。また、図６（Ｃ）に示すように表示領域６０３の位置で慣性スクロールが停止しようとした場合、表示領域を下方に補正した方が表示領域の補正量は少ない。そのため、情報処理装置１００は、図６（Ｄ）に示すように表示領域６０４を下方に補正し、＜ｃａｎｖａｓ＞要素の描画部分５０２の下部にＷｅｂページをスワイプ可能な領域が含まれる位置に表示領域を決定する。このように、Ｗｅｂページをスワイプする領域を含む表示領域になるように制御することで、ユーザがＷｅｂページを常にスクロール可能にし、Ｗｅｂページのスクロールができない状態になることを回避することができる。
In the example shown in FIG. 6(A), the
なお、表示領域の補正は、一旦、通常の慣性スクロールが停止する位置を表示した後に行ってもいいし、慣性スクロール中にスクロールが停止する位置を予測し、最終的に補正後の表示領域でスクロールが停止するように見せてもよい。一旦、慣性スクロールが停止した後、算出した補正量に基づき表示領域を補正すれば、ユーザが見た目に表示領域の補正がなされたことが分かるようになる。一方、慣性スクロール中に、通常の慣性スクロールが停止するときの表示領域の位置、及びそれに基づく補正量を算出し、補正量を加味した位置にスクロールを停止したときの表示領域を決定すれば、補正をユーザに感じさせないような表示にすることができる。 The display area may be corrected after the position where normal inertial scrolling would stop is displayed, or the position where scrolling will stop during inertial scrolling may be predicted and the scrolling may finally appear to stop at the corrected display area. If the display area is corrected based on the calculated correction amount once inertial scrolling has stopped, the user will be able to see that the display area has been corrected. On the other hand, if the position of the display area when normal inertial scrolling stops during inertial scrolling and the correction amount based on this are calculated, and the display area when scrolling stops at a position taking the correction amount into account is determined, a display can be created that does not make the correction noticeable to the user.
図７は、表示領域が＜ｃａｎｖａｓ＞要素、＜ｉｆｒａｍｅ＞要素の２つの描画結果を含み、それら要素の描画部分の間にＷｅｂページをスワイプ可能な領域がない例を示している。図７（Ａ）は慣性スクロールが通常停止する表示領域を示している。図７（Ｂ）及び図７（Ｃ）はＷｅｂページをスクロールするためのスワイプ可能な領域を確保するように補正した表示領域の例を示している。 Figure 7 shows an example where the display area includes two rendering results, a <canvas> element and an <iframe> element, and there is no area between the rendering parts of these elements where a web page can be swiped. Figure 7(A) shows the display area where inertial scrolling normally stops. Figures 7(B) and 7(C) show examples of a display area that has been corrected to ensure a swipeable area for scrolling a web page.
７００はＨＴＭＬ文書全体を描画した描画結果である。７０１は、図４（Ａ）に示した＜ｈ１＞要素、＜ｈ２＞要素、及び＜ｌｉ＞要素の描画部分である。図７（Ａ）において、表示領域７０４は、＜ｃａｎｖａｓ＞要素の描画部分７０２と＜ｉｆｒａｍｅ＞要素の描画部分７０３で広く覆われている。この表示領域７０４でスワイプをすると、＜ｃａｎｖａｓ＞要素や＜ｉｆｒａｍｅ＞要素に割り当てられた、線の描画や地図の移動等の処理が行われる。Ｗｅｂページのスクロールをするには、＜ｃａｎｖａｓ＞要素の描画部分７０２や＜ｉｆｒａｍｅ＞要素の描画部分７０３ではない領域が必要である。しなしながら、＜ｃａｎｖａｓ＞要素の描画部分７０２と＜ｉｆｒａｍｅ＞要素の描画部分７０３との間にＷｅｂページをスクロールするための十分な領域、言い換えればユーザ操作がＷｅｂページに対する操作として扱われる領域が含まれていない。そのため、図７（Ａ）に示す表示領域７０４となった場合、Ｗｅｂページをスクロールすることができない状態になる。
700 is the rendering result of rendering the entire HTML document. 701 is the rendering portion of the <h1> element, <h2> element, and <li> element shown in FIG. 4(A). In FIG. 7(A), the
その状態を回避するため、本実施形態では、例えば図７（Ｂ）に示す表示領域７１１や表示領域７１２の位置に表示領域を補正することにより、Ｗｅｂページをスクロールするためのスワイプ可能な領域を確保する。情報処理装置１００は、慣性スクロールが通常停止する表示領域、この例の場合には表示領域７０４に、Ｗｅｂページのスクロールを指示するスワイプ領域がないと判断した場合、表示領域７０２や表示領域７０３の位置に補正する。
To avoid this state, in this embodiment, a swipeable area for scrolling the web page is secured by correcting the display area to the position of
表示領域７１１は、＜ｃａｎｖａｓ＞要素の描画部分７０２の上端から上方の位置に、Ｗｅｂページをスワイプするための所定のサイズの領域が確保されるように表示領域を補正している例である。また、表示領域７１２は、＜ｉｆｒａｍｅ＞要素の描画部分７０３の下端より下方の位置に、Ｗｅｂページをスワイプするための所定サイズの領域が確保されるように表示領域を補正している例である。
表示領域７１１に補正するか、表示領域７１２に補正するかは、慣性スクロールが通常停止するはずであった表示領域７０４からの補正量に基づいて判断してもよい。本来停止する位置からの距離が小さい方がユーザにとっては自然に見えるため、例えば、表示領域７０４を表示領域７１１や表示領域７１２の位置に移動する補正量を算出して、補正量が小さい方に表示領域を補正する。また、事前に行ったスクロール方向を優先して補正する表示領域を決定してもよい。慣性スクロールが一旦、表示領域７０４で停止し、その後、表示領域を補正した位置にずらすようにユーザに見せる場合、スクロールが進む方向に補正した方がユーザにとって自然に見えるため、表示領域７１２の位置に表示領域を補正する。
Whether to correct to
図７（Ｃ）は、＜ｃａｎｖａｓ＞要素の描画部分７０２と＜ｉｆｒａｍｅ＞要素の描画部分７０３との間にＷｅｂページをスクロールするためのスワイプ可能な領域を確保するように描画結果を変更する例を示している。＜ｉｆｒａｍｅ＞要素の描画部分７０３の開始位置を下方にずらした描画結果と、表示領域７２１を表している。図７（Ｂ）に示した、表示領域７０４を表示領域７１１や表示領域７１２の位置に表示領域を補正する場合、補正量が大きくなる。または、内部コンテンツが複数個、隙間を空けずに表示されるようなＷｅｂコンテンツである場合、描画結果において上端及び下端に表示される内部コンテンツ以外の内部コンテンツは表示できないことになる。例えば、埋め込み地図を示す＜ｉｆｒａｍｅ＞要素が１０個、隙間を空けずに縦方向に配置されたＷｅｂコンテンツがあったとする。慣性スクロールで通常停止したときの表示領域が５番目と６番目の地図にまたがった表示領域になるとき、表示領域の移動による補正では、表示領域は１番目の地図とその上方を含む領域、もしくは、１０番目の地図とその下方を含む領域に補正されることになる。そのため、最終的な表示領域がその他の地図を含む位置になることがない。
Figure 7 (C) shows an example of changing the drawing result so as to secure a swipeable area for scrolling a Web page between the drawing
このような場合には、情報処理装置１００は、表示領域内にＷｅｂページをスクロールするためのスワイプ可能な領域を有するように再描画して描画結果を作り直して表示領域を決定する。例えば、表示領域７０４に存在する、＜ｃａｎｖａｓ＞要素及び＜ｉｆｒａｍｅ＞要素の描画部分７０２、７０３以外の領域を広げた描画結果を再描画で作成する。具体的には、情報処理装置１００は、＜ｃａｎｖａｓ＞要素の描画部分７０２と＜ｉｆｒａｍｅ＞要素の描画部分７０３との間の領域にＷｅｂページをスワイプするための所定サイズの領域を有するようにＨＴＭＬ文書を変更して再描画を行う。Ｗｅｂページをスワイプするために必要なサイズをもとに、＜ｃａｎｖａｓ＞要素の描画部分７０２と＜ｉｆｒａｍｅ＞要素の描画部分７０３との間に不足している領域サイズを算出する。そして、そのサイズの領域を表示するための要素、例えば、<div style="margin-top:算出サイズ;"></div>を＜ｃａｎｖａｓ＞要素と＜ｉｆｒａｍｅ＞要素との間に挿入したＨＴＭＬ文書をもとに描画結果を作成する。そして、新しく作成した描画結果に対して、表示領域７０４と同じ座標に表示領域を決定する。これにより、図７（Ｃ）に示すように＜ｃａｎｖａｓ＞要素の描画部分７０２と＜ｉｆｒａｍｅ＞要素の描画部分７０３との間に、Ｗｅｂページをスクロールするためのスワイプ可能な領域をもつ表示領域７２１となる。
In such a case, the
図８は、Ｗｅｂページの描画結果、表示領域、内部コンテンツの座標を説明する図である。Ｗｅｂページの描画結果に１つの内部コンテンツが含まれている様子を示している。図８において、８０１は幅Ｗp、高さＨpを持つＷｅｂページの描画結果である。８０２は、幅Ｗd、高さＨdを持つ表示領域である。表示領域８０２は、描画結果８０１の左上端を原点として右方向及び下方向をそれぞれｘ座標及びｙ座標の正とする座標系において、矩形の左上端を（ｘd，ｙd）、右下端を（ｘd＋Ｗd，ｙd＋Ｈd）で位置を表現する。８０３は、幅Ｗc、高さＨcを持つ内部コンテンツである。内部コンテンツ８０３は、表示領域８０２の左上端を原点として右方向及び下方向をそれぞれｘ座標及びｙ座標の正とする座標系において、矩形の左上端を（ｘc，ｙc）、右下端を（ｘc＋Ｗc，ｙc＋Ｈc）で位置を表現する。また、描画結果中の表示領域８０２の移動を表現する際、ｘ方向の移動量をｄx、ｙ方向の移動量をｄyで表す。そして、Ｗｅｂページをスクロールするために最低限必要となる領域である矩形８０４の幅をＷs、高さをＨsとする。以後、この座標系を用いて表示領域の補正について説明する。
FIG. 8 is a diagram for explaining the coordinates of the rendering result, display area, and internal contents of a Web page. It shows a state in which one internal content is included in the rendering result of a Web page. In FIG. 8, 801 is the rendering result of a Web page having a width Wp and a height Hp . 802 is a display area having a width Wd and a height Hd . In the display area 802, the position of the upper left end of the rectangle is expressed as ( xd , yd ) and the lower right end as (xd + Wd , yd + Hd ) in a coordinate system in which the upper left end of the rendering result 801 is the origin and the right direction and the lower direction are positive x coordinates and y coordinates, respectively. 803 is an internal content having a width Wc and a height Hc . In a coordinate system in which the upper left corner of the display area 802 is the origin and the right and bottom directions are positive x and y coordinates, respectively, the position of the internal content 803 is expressed as ( xc , yc ) for the upper left corner of the rectangle and ( xc + Wc , yc + Hc ) for the lower right corner. When expressing the movement of the display area 802 in the drawing result, the amount of movement in the x direction is expressed as dx , and the amount of movement in the y direction is expressed as dy . The width and height of the
本実施形態における情報処理装置１００の処理例を図９に示すフローチャートを参照して説明する。図９に示す処理は、描画結果中の表示領域が変わるときに実行される。例えば、ＷｅｂページのＷｅｂコンテンツを初めて読み込んで描画結果を生成して表示領域を確定するとき、又は、ユーザのＷｅｂページ再読み込みの指示により再描画して、改めて表示領域を算出したときに、図９に示す処理が実行される。または、ユーザによって慣性スクロールや描画結果の拡大縮小操作などが行われて表示領域が変更する時点で、図９に示す処理が実行される。なお、スクロールは、ユーザのスワイプ操作以外にもＪａｖａＳｃｒｉｐｔのｓｃｒｏｌｌ関数、ｓｃｒｏｌｌＢｙ関数、ｓｃｒｏｌｌＴｏ関数などにより指示される場合もある。
An example of processing of the
ステップＳ９０１では、表示制御部２０１は、ＷｅｂページにおいてスワイプでＷｅｂページのスクロールとは別の処理を行う内部コンテンツを抽出した後、ステップＳ９０２に進む。表示制御部２０１は、Ｗｅｂページに含まれる各要素の情報に基づいて、スワイプでＷｅｂページのスクロールとは別の処理を行う内部コンテンツであるか否かを判定する。表示制御部２０１は、例えば、ＪａｖａＳｃｒｉｐｔを解析してスワイプで発生するイベントが別処理に割り当てられているかどうかによって判定する。例えば、＜ｃａｎｖａｓ＞要素に対する処理を規定した図４（Ｃ）に示したＪａｖａＳｃｒｉｐｔでは、スワイプにより発生するｔｏｕｃｈｓｔａｒｔ、ｔｏｕｃｈｍｏｖｅ、ｔｏｕｃｈｅｎｄの各イベントを取得することが記述されている。そして、取得したイベントに対する座標を用いてｌｉｎｅＴｏ、ｓｔｒｏｋｅで線を描画している。この場合、表示制御部２０１は、この＜ｃａｎｖａｓ＞要素を、スワイプで動作し、スワイプ操作に応じてＷｅｂページのスクロールとは別の処理を行う内部コンテンツと判定する。このようにスワイプ操作で発生するイベントを把握しておき、そのイベントに対する処理が別途規定されているか否かによって、スワイプでＷｅｂページのスクロールとは別の処理を行う内部コンテンツであるか否かを判定する。
In step S901, the
また、表示制御部２０１は、例えば、ｓｒｃ属性によって特定のＵＲＬが指定されている要素を、スワイプでＷｅｂページのスクロールとは別の動作を行う内部コンテンツと判定する。図４（Ａ）に示した＜ｉｆｒａｍｅ＞要素は、ｓｒｃ属性値で地図サービスのＵＲＬが指定されている。各種の地図サービスでは、それぞれのサービス毎に地図に表示する緯度、経度の変更や拡大、縮小を指示する操作を定義しており、例えば、スワイプに対して緯度、経度の変更を割り当てているものもある。このような地図サービスがｓｒｃ属性で指定されていると、＜ｉｆｒａｍｅ＞要素の描画領域におけるスワイプはＷｅｂページのスクロールではなく、例えば、地図の緯度や経度の変更として処理される。このようにスワイプ操作に対して別の操作を割り当てているサービスのＵＲＬを予めリストとして保持しておき、＜ｉｆｒａｍｅ＞のｓｒｃ属性で指定されたＵＲＬがこのリストにあるか否かを判定する。これにより、スワイプでＷｅｂページのスクロールとは別の処理を行う内部コンテンツであるか否かを判定する。
In addition, the
なお、ステップＳ９０１の処理は、スワイプが発生して表示領域が変わる時点で毎回実行するのではなく、Ｗｅｂコンテンツを最初に読み込んだ際にＨＴＭＬ文書やＪａｖａＳｃｒｉｐｔ等を解析して対象となる内部コンテンツを抽出しておくようにしてもよい。 The process of step S901 does not have to be executed every time a swipe occurs and the display area changes, but may be executed by analyzing the HTML document, JavaScript, etc., when the web content is first loaded and extracting the target internal content.
ステップＳ９０２では、判定部２０２が、表示制御部２０１から入手した内部コンテンツの情報及び表示領域の情報に基づいて、スワイプでＷｅｂページのスクロールとは別の処理を行う内部コンテンツが表示領域内にあるか否かを判定する。スワイプでＷｅｂページのスクロールとは別の処理を行う内部コンテンツが表示領域内にあると判定部２０２が判定した場合（ステップＳ９０２においてＹＥＳ）、ステップＳ９０３に進む。スワイプでＷｅｂページのスクロールとは別の処理を行う内部コンテンツが表示領域内にないと判定部２０２が判定した場合（ステップＳ９０２においてＮＯ）、ステップＳ９０４に進む。
In step S902, the
具体例を図８に示した座標に基づいて説明する。矩形の内部コンテンツ８０３の左上座標、右下座標を用いて表示領域８０２内にあるか判断する。内部コンテンツ８０３について、「上端のｙ座標（ｙc）≦Ｈd」かつ、「０≦下端のｙ座標（ｙc＋Ｈc）」かつ、「左端のｘ座標（ｘc）≦Ｗd」かつ、「０≦右端のｘ座標（ｘc＋Ｗc）」であるか判定する。該当する場合、内部コンテンツ８０３が表示領域８０２内にあると判定する。例えば、図６（Ａ）に示した表示領域６０１の場合、内部コンテンツである＜ｃａｎｖａｓ＞要素５０２の上端のｙ座標（ｙc）はＨd以下の値であり、下端のｙ座標（ｙc＋Ｈc）はプラスの値である。また、左端のｘ座標（ｘc）は０であり、Ｗd以下の値であり、右端のｘ座標（ｘc＋Ｗc）はＷcであり、プラスの値である。したがって、内部コンテンツである＜ｃａｎｖａｓ＞要素５０２の左上座標、右下座標は条件を満たすため、判定部２０２は、＜ｃａｎｖａｓ＞要素５０２が表示領域６０１内にあると判定する。
A specific example will be described based on the coordinates shown in FIG. 8. The top left and bottom right coordinates of the rectangular internal content 803 are used to determine whether it is within the display area 802. For the internal content 803, it is determined whether "the y coordinate of the top edge ( yc )≦ Hd ", "0≦the y coordinate of the bottom edge ( yc + Hc )", "the x coordinate of the left edge ( xc )≦ Wd ", and "0≦the x coordinate of the right edge ( xc + Wc )". If so, it is determined that the internal content 803 is within the display area 802. For example, in the case of the
ステップＳ９０３では、判定部２０２が、表示領域内にＷｅｂページのスクロールを指示するためのスワイプ領域が含まれているか否かを判定する。表示領域内にＷｅｂページのスクロールを指示するためのスワイプ領域が含まれていると判定部２０２が判定した場合（ステップＳ９０３においてＹＥＳ）、ステップＳ９０４に進む。表示領域内にＷｅｂページのスクロールを指示するためのスワイプ領域が含まれていないと判定部２０２が判定した場合（ステップＳ９０３においてＮＯ）、ステップＳ９０５に進む。
In step S903, the
図８に示した座標の場合、表示領域８０２内にステップＳ９０２において表示領域内にあると判定した内部コンテンツ以外の領域として、Ｗｅｂページをスクロールするために最低限必要となる幅Ｗs以上、高さＨs以上の矩形領域が存在するか否かを判定する。図８に示した例のように、１つの内部コンテンツ８０３が含まれている場合、判定部２０２は、内部コンテンツ８０３の上下左右のいずれかの領域に（Ｗs×Ｈs）のサイズの領域が含まれるか否かを判定する。つまり、判定部２０２は、「ｙc≧Ｈs」、「Ｈd－（ｙc＋Ｈc）≧Ｈs」、「ｘc≧Ｗs」、「Ｗd－（ｘc＋Ｗc）≧Ｗs」のいずれかの条件を満たすか否かを判定する。図６（Ａ）に示した表示領域６０１の場合、表示領域６０１の上部に内部コンテンツ以外の領域があるが、ｙc＜Ｈsの例であるため、Ｗｅｂページをスクロールするために最低限必要となる領域がないと判定する。
In the case of the coordinates shown in FIG. 8, it is determined whether or not a rectangular area with a width of W s or more and a height of H s or more, which is the minimum required area for scrolling a Web page, exists within the display area 802 as an area other than the internal content determined to be within the display area in step S902. As in the example shown in FIG. 8, when one internal content 803 is included, the
ステップＳ９０４では、制御部２０３が、最終的に決定した位置に表示領域を定める。図８に示した座標の場合、左上座標を（ｘd，ｙd）とし、幅Ｗd及び高さＨdとする矩形を表示領域として設定する。そして、表示制御部２０１が、描画結果の表示領域をＷｅｂブラウザに表示する。
In step S904, the
ステップＳ９０５では、制御部２０３が、Ｗｅｂページをスクロールするために最低限必要となる領域を表示領域内に表示するための表示領域の補正量を算出して、ステップＳ９０６に進む。制御部２０３は、通常表示する表示領域を上下左右のどの方向にどの量、移動すればＷｅｂページをスクロールするために最低限必要となる領域の幅Ｗs、高さＨsの矩形領域が表示領域内に表示されるかを算出する。
In step S905, the
図８に示したように１つの内部コンテンツ８０３を含む場合、制御部２０３は、以下の値を算出する。ｘ方向の補正量をｄxとし、ｙ方向の補正量をｄyとする。
・表示領域の上端に幅Ｗd、高さＨd以上の領域を確保する場合：
ｄy≦（ｙc－Ｈs）
・表示領域の下端に幅Ｗd、高さＨd以上の領域を確保する場合：
ｄy≧（Ｈs－Ｈd＋ｙc＋Ｈc）
・表示領域の左端に幅Ｗd、高さＨd以上の領域を確保する場合：
ｄx≦（ｘc－Ｗs）
・表示領域の右端に幅Ｗd、高さＨd以上の領域を確保する場合：
ｄx≧（Ｗs－Ｗd＋ｘc＋Ｗc）
8, when one internal content 803 is included, the
When reserving an area of width W d and height H d or more at the top edge of the display area:
d y ≦ (y c - H s )
- When reserving an area of width W d and height H d or more at the bottom edge of the display area:
d y ≧ (H s −H d +y c +H c )
- To secure an area of width W d and height H d or more on the left edge of the display area:
d x ≦ (x c - W s )
- To secure an area with width W d and height H d or more on the right edge of the display area:
d x ≧ (W s −W d +x c +W c )
さらに、制御部２０３は、算出した補正量について、表示領域を移動した場合に表示領域が描画結果内に収まり、かつ、補正によって得られる表示領域にスワイプで別の処理を行う内部コンテンツの領域が入らない条件に合う補正値を選ぶ。例えば、図６（Ａ）に示した表示領域６０１である場合、表示領域と描画結果の幅がほぼ同じであるため、左右方向にＷsの幅をとるための補正をすると、Ｗｅｂページの描画結果を越えてしまう。また、＜ｃａｎｖａｓ＞要素５０２と＜ｉｆｒａｍｅ＞要素５０３との間にＨsの高さがない場合、補正後の表示領域の下端に幅Ｗd、高さＨd以上の領域を確保することができない。そのため、この場合には採用する補正量の候補は上方向のみになる。また、例えば、図７（Ａ）に示した表示領域７０４のように、２つの内部コンテンツ７０２、７０３が連なって存在する場合でも同様に補正量を算出して、条件に合う補正値を選ぶ。この場合、図７（Ｂ）に示した表示領域７１１又は表示領域７１２が表示領域の補正する候補になる。なお、補正量を算出した結果、条件にあう補正値が候補として挙がらなかった場合でもステップＳ９０６に進む。
Furthermore, the
ステップＳ９０６では、制御部２０３が、ステップＳ９０５において選出した補正量の中で絶対値が最小のものが所定値以下であるか否かを判定する。補正量が所定値よりも大きいと制御部２０３が判定した場合（ステップＳ９０６においてＮＯ）、ステップＳ９０７に進む。補正量が所定値以下であると制御部２０３が判定した場合（ステップＳ９０６においてＹＥＳ）、ステップＳ９０８に進む。なお、ステップＳ９０５において補正値が候補として挙がらなかった場合にもステップＳ９０７に進む。
In step S906, the
通常表示する表示領域に対して、最終的に決定する表示領域の位置が大きく異なる場合、ユーザにとって違和感のある表示となることがある。そのため、ステップＳ９０５において選出した補正量の絶対値が最小のものについて、所定値以下であるか否かを判定する。例えば、図６（Ａ）に示した表示領域６０１である場合、上方向への補正量が小さく、所定値以下と判定されてステップＳ９０８に進む。また、例えば、図７（Ａ）に示した表示領域７０４のような場合、各内部コンテンツについて補正値を算出した結果、採用する補正量の候補は上方向に移動して表示領域７１１の位置にするか、下方向に移動して表示領域７１２の位置にするかの二択になる。例えば、補正量の絶対値が小さい表示領域７１１への補正量を所定値と比較し、所定値より大きいと判定するとステップＳ９０７に進む。
If the position of the display area to be finally determined is significantly different from the display area that is normally displayed, the display may be unnatural to the user. Therefore, for the display area selected in step S905, the absolute value of the correction amount selected is judged to be equal to or less than a predetermined value. For example, in the case of the
ステップＳ９０７では、制御部２０３が、表示領域内にＷｅｂページをスクロールするために最低限必要となる幅Ｗs以上、高さＨs以上の矩形領域を有するように描画結果を変更する。通常の表示領域が図７（Ａ）に示した表示領域７０４である場合、制御部２０３は、内部コンテンツである＜ｃａｎｖａｓ＞要素７０２、＜ｉｆｒａｍｅ＞要素７０３の間、又は左右の位置に幅Ｗs以上、高さＨs以上の矩形領域を持つように描画結果を変更する。図７（Ａ）に示した表示領域７０４の場合、内部コンテンツの左右に新たに幅Ｗs以上、高さＨs以上の領域を作るよりも、＜ｃａｎｖａｓ＞要素７０２と＜ｉｆｒａｍｅ＞要素７０３との間に幅Ｗs以上、高さＨs以上の矩形領域を作る方が少ない変更で済む。そのため、制御部２０３は、＜ｃａｎｖａｓ＞要素７０２と＜ｉｆｒａｍｅ＞要素７０３の描画結果の間の距離と、幅Ｗs、高さＨsとに基づいて、Ｗｅｂページをスクロールする領域を確保するために不足している高さを算出する。そして、その領域を表示するための要素、<div style="margin-top:算出サイズ;"></div>を＜ｃａｎｖａｓ＞要素と＜ｉｆｒａｍｅ＞要素との間に挿入したＨＴＭＬ文書を生成して、表示制御部２０１にて描画結果を作成する。このようにして新たな描画結果上に表示領域を確定する。表示領域内に表示される内部コンテンツ間に幅Ｗs、高さＨsの領域をとったので、通常の表示領域の座標を変更することなく左上の座標を（ｘd，ｙd）とする表示領域に確定する。もし、＜ｃａｎｖａｓ＞要素の右側に新たに少なくとも幅Ｗs、高さＨsの領域を有するようにＨＴＭＬ文書を変更したのであれば、左上の座標を（ｘd＋Ｗs，ｙd）とする表示領域に確定する。即ち、制御部２０３は、Ｗｅｂページを描画するためのＨＴＭＬ文書には記述がないタグを追加した（または、タグの内容を書き換えた）ＨＴＭＬ文書を新たに作成する。そして、制御部２０３は、所定サイズ以上の操作領域を表示させるため、生成したＨＴＭＬ文書に従ったＷｅｂページの描画を行う。
In step S907, the
ステップＳ９０８では、表示制御部２０１は、制御部２０３がステップＳ９０６において決定した補正量、もしくは、ステップＳ９０８において新たに生成した描画結果と表示領域の座標を用いて表示領域を決定する。表示制御部２０１は、制御部２０３から表示領域の補正量を指示された場合、通常表示する表示領域に補正量を加えた領域を表示領域として決定する。表示制御部２０１は、制御部２０３から新たな描画結果と表示領域の座標を指示された場合、新たな描画結果を表示対象として指示された座標に表示領域をとる。そして、ステップＳ９０４において、表示制御部２０１が、描画結果の表示領域をＷｅｂブラウザに表示する。
In step S908, the
以上の処理により、Ｗｅｂページの表示状態が所定の条件を満たさない場合には、Ｗｅｂページをスクロールするために最低限必要となる幅Ｗs以上、高さＨs以上の矩形領域を表示領域に確保することで、Ｗｅｂページのスクロールを常に行えるようになる。 By the above processing, when the display state of the Web page does not satisfy the predetermined conditions, a rectangular area having a width of at least Ws and a height of at least Hs , which is the minimum required for scrolling the Web page, is secured in the display area, thereby making it possible to always scroll the Web page.
なお、ステップＳ９０７においては、新たに＜ｄｉｖ＞要素を追加することによりＷｅｂページをスクロールするために最低限必要となる幅Ｗs以上、高さＨs以上の矩形領域を表示領域に確保する例を示した。しかし、これに限らず内部コンテンツを縮小することにより、Ｗｅｂページをスクロールするために最低限必要となる領域を確保するようにしてもよい。 In step S907, an example has been shown in which a rectangular area with a width of Ws or more and a height of Hs or more, which are the minimum required for scrolling a Web page, is secured in the display area by adding a new <div> element. However, the present invention is not limited to this, and the minimum required area for scrolling a Web page may be secured by reducing the internal content.
例えば、図６（Ａ）に示した表示領域６０１である場合、内部コンテンツである＜ｃａｎｖａｓ＞要素５０２の描画領域を縮小して、Ｗｅｂページをスクロールするために最低限必要となる幅Ｗs以上、高さＨs以上の矩形領域を表示領域に持つようにする。例えば、幅Ｗc、高さＨcの＜ｃａｎｖａｓ＞要素、幅Ｗd、高さＨdの表示領域、及びＷｅｂページをスクロールするために最低限必要となる幅Ｗs、高さＨsの矩形領域を用いて、以下のように＜ｃａｎｖａｓ＞要素の縮小率を算出する。
・Ｗｅｂページをスクロールするために最低限必要となる幅Ｗs以上、高さＨs以上の矩形領域をｘ方向、内部コンテンツの右側に作る場合の倍率ｓx（ｔｏｐ、ｌｅｆｔ起点）：
ｓx≦（Ｗd－Ｗs－ｘc）／Ｗc
・Ｗｅｂページをスクロールするために最低限必要となる幅Ｗs以上、高さＨs以上の矩形領域をｘ方向、内部コンテンツの左側に作る場合の倍率ｓx（ｔｏｐ、ｒｉｇｈｔ起点）：
ｓx≦（Ｗc－Ｗs＋ｘc）／Ｗc
・Ｗｅｂページをスクロールするために最低限必要となる幅Ｗs以上、高さＨs以上の矩形領域をｙ方向、内部コンテンツの下側に作る場合の倍率ｓy（ｔｏｐ、ｌｅｆｔ起点）：
ｓy≦（Ｈd－Ｈs－ｙc）／Ｈc
・Ｗｅｂページをスクロールするために最低限必要となる幅Ｗs以上、高さＨs以上の矩形領域をｙ方向、内部コンテンツの上側に作る場合の倍率ｓy（ｂｏｔｔｏｍ、ｌｅｆｔ起点）：
ｓy≦（Ｈc－Ｈs＋ｙc）／Ｈc
6A, the drawing area of the <canvas>
Magnification s x (starting points top and left) when creating a rectangular area of at least width W s and height H s required for scrolling a Web page to the right of the internal content in the x direction:
s x ≦ (W d - W s - x c )/W c
Magnification s x (starting points top and right) when creating a rectangular area of at least width W s and height H s required for scrolling a Web page to the left of the internal content in the x direction:
s x ≦ (W c - W s + x c )/W c
Magnification s y (starting points top and left) when creating a rectangular area with a width of at least W s and a height of at least H s required for scrolling a Web page below the internal content in the y direction:
s y ≦(H d - H s - y c )/H c
Magnification s y (bottom, left starting point) when creating a rectangular area with a width of at least W s and a height of at least H s required for scrolling a Web page above the internal content in the y direction:
s y ≦ (H c - H s + y c )/H c
そして、例えば、大きい倍率の方の値を使用して、＜ｃａｎｖａｓ＞要素を縮小して表示するようにＨＴＭＬ文書を変更したのち描画結果を作り直す。４つの縮小率のうち、最大値になる縮小率を採用する。ｓx（ｔｏｐ、ｌｅｆｔ起点）であれば、以下のように＜ｃａｎｖａｓ＞要素にスケールを変換するｓｔｙｌｅ属性を追加して＜ｃａｎｖａｓ＞要素の描画部分を縮小表示して、Ｗｅｂページをスクロールするために最低限必要となる領域を確保する。ｔｏｐ、ｌｅｆｔを起点にして、ｘ方向、ｙ方向にｓx倍する例である。
<canvas width="W1" height="H1"
style="transform: scale(sx, sx);transform-origin: top left;"></canvas>
ｔｏｐ、ｌｅｆｔを起点にしているので＜ｃａｎｖａｓ＞要素の描画領域の右側にＷｅｂページをスクロースする領域を表示する。
Then, for example, the larger magnification value is used to modify the HTML document so that the <canvas> element is displayed in a reduced size, and then the drawing result is recreated. Of the four reduction ratios, the maximum reduction ratio is adopted. If it is s x (starting from top and left), a style attribute that converts the scale is added to the <canvas> element as shown below to reduce and display the drawing portion of the <canvas> element, and the minimum area required for scrolling the Web page is secured. This is an example of multiplying by s x in the x and y directions, starting from top and left.
<canvas width="W1"height="H1"
style="transform: scale(s x , s x );transform-origin: top left;"></canvas>
Since the top and left are the starting points, the area for scrolling the Web page is displayed to the right of the drawing area of the <canvas> element.
なお、ステップＳ９０７においてＨＴＭＬ文書を変更して描画結果を扱うが、スクロールなどによって表示領域が変わり、元のＨＴＭＬ文書の描画結果でＷｅｂページをスワイプする領域がある位置になった場合、ＨＴＭＬ文書変更後の描画結果は不要となる。そのため、ＨＴＭＬ文書変更する場合、元の描画結果も保持しておく。そして、変更後の描画結果を表示している際に表示領域の移動が発生した場合、変更前の描画結果に対する表示領域の移動状態を管理しておき、その情報をもとに図９に示したフローを開始する。このようにすることで、ステップＳ９０７においてＨＴＭＬ文書を変更した描画結果は、Ｗｅｂページにスクロールする領域がない状況に限られたものになる。 Note that in step S907, the HTML document is modified to handle the rendering result, but if the display area changes due to scrolling or the like, and the rendering result of the original HTML document is in a position where there is an area for swiping the web page, the rendering result after the HTML document is modified becomes unnecessary. Therefore, when the HTML document is modified, the original rendering result is also retained. Then, if the display area moves while the modified rendering result is being displayed, the movement state of the display area relative to the rendering result before the modification is managed, and the flow shown in FIG. 9 is started based on that information. In this way, the rendering result after the HTML document is modified in step S907 is limited to situations where there is no area on the web page to scroll.
（本発明の他の実施形態）
本発明は、前述の実施形態の１以上の機能を実現するプログラムを、ネットワーク又は記憶媒体を介してシステム又は装置に供給し、そのシステム又は装置のコンピュータにおける１つ以上のプロセッサがプログラムを読み出し実行する処理でも実現可能である。また、１以上の機能を実現する回路（例えば、ＡＳＩＣ）によっても実現可能である。
Other Embodiments of the Invention
The present invention can also be realized by a process in which a program for implementing one or more of the functions of the above-described embodiment is supplied to a system or device via a network or a storage medium, and one or more processors in a computer of the system or device read and execute the program. The present invention can also be realized by a circuit (e.g., ASIC) for implementing one or more of the functions.
なお、前記実施形態は、何れも本発明を実施するにあたっての具体化のほんの一例を示したものに過ぎず、これらによって本発明の技術的範囲が限定的に解釈されてはならないものである。すなわち、本発明はその技術思想、又はその主要な特徴から逸脱することなく、様々な形で実施することができる。 The above embodiments are merely examples of the implementation of the present invention, and the technical scope of the present invention should not be interpreted in a limiting manner based on these. In other words, the present invention can be implemented in various forms without departing from its technical concept or main features.
１００：情報処理装置 １１０：コントローラ部 １１１：ＣＰＵ １１２：ＲＯＭ １１３：ＲＡＭ １２０：操作部 １３０：表示部 １４０：記憶部 １５０：通信部 ２０１：表示制御部 ２０２：判定部 ２０３：制御部 100: Information processing device 110: Controller unit 111: CPU 112: ROM 113: RAM 120: Operation unit 130: Display unit 140: Storage unit 150: Communication unit 201: Display control unit 202: Determination unit 203: Control unit
Claims (7)
前記Ｗｅｂページの前記コンテンツを含む領域を前記表示部に表示させる場合、前記コンテンツを示す領域とは異なり、該Ｗｅｂページをスクロールするための操作領域を所定以上のサイズとするよう前記表示部における前記Ｗｅｂページの表示を制御する制御手段と、
前記Ｗｅｂページのユーザ操作に応じた前記表示部における表示領域であって、前記Ｗｅｂページの第１の表示領域が所定の条件を満たすか否かを判定する判定手段とを有し、
前記判定手段は、前記第１の表示領域における前記コンテンツを示す領域に基づいて、前記第１の表示領域において前記操作領域が所定以上のサイズとなるか否かを判定し、
前記制御手段は、前記第１の表示領域では前記操作領域が前記所定以上のサイズにならない場合、前記所定以上のサイズの前記操作領域を含む第２の表示領域で前記Ｗｅｂページを表示するよう制御することを特徴とする情報処理装置。 a display control means for displaying a web page having a content for accepting input of an instruction operation on a display unit for accepting input of the instruction operation by a touch operation;
a control means for controlling display of the web page on the display unit so that, when an area including the content of the web page is displayed on the display unit, an operation area for scrolling the web page is set to a size equal to or larger than a predetermined size, which is different from an area showing the content ;
a determination means for determining whether a first display area of the Web page on the display unit in response to a user operation of the Web page satisfies a predetermined condition;
the determining means determines whether or not the operation area in the first display area has a size equal to or larger than a predetermined size based on an area showing the content in the first display area;
The information processing device is characterized in that the control means controls the web page to be displayed in a second display area including the operation area of a size equal to or larger than the specified size when the operation area in the first display area does not become a size equal to or larger than the specified size.
指示操作の入力を受付けるコンテンツを有するＷｅｂページを前記表示部に表示させる表示制御工程と、
前記Ｗｅｂページの前記コンテンツを含む領域を前記表示部に表示させる場合、前記コンテンツを示す領域とは異なり、該Ｗｅｂページをスクロールするための操作領域を所定以上のサイズとするよう前記表示部における前記Ｗｅｂページの表示を制御する制御工程と、
前記Ｗｅｂページのユーザ操作に応じた前記表示部における表示領域であって、前記Ｗｅｂページの第１の表示領域が所定の条件を満たすか否かを判定する判定工程とを有し、
前記判定工程にて、前記第１の表示領域における前記コンテンツを示す領域に基づいて、前記第１の表示領域において前記操作領域が所定以上のサイズとなるか否かを判定し、
前記制御工程にて、前記第１の表示領域では前記操作領域が前記所定以上のサイズにならない場合、前記所定以上のサイズの前記操作領域を含む第２の表示領域で前記Ｗｅｂページを表示するよう制御することを特徴とする情報処理方法。 An information processing method for an information processing device having a display unit that accepts input of an instruction operation by a touch operation, comprising:
a display control step of causing the display unit to display a web page having content for accepting input of an instruction operation;
a control step of controlling display of the web page on the display unit so that, when an area including the content of the web page is displayed on the display unit, an operation area for scrolling the web page is set to a size equal to or larger than a predetermined size, which is different from an area showing the content;
a determination step of determining whether a first display area of the Web page on the display unit in response to a user operation of the Web page satisfies a predetermined condition,
In the determining step, it is determined whether or not the operation area in the first display area has a size equal to or larger than a predetermined size based on an area showing the content in the first display area;
An information processing method characterized in that, in the control process, if the operation area in the first display area does not become a size larger than the specified size, the web page is controlled to be displayed in a second display area including the operation area of a size larger than the specified size .
指示操作の入力を受付けるコンテンツを有するＷｅｂページを前記表示部に表示させる表示制御ステップと、
前記Ｗｅｂページの前記コンテンツを含む領域を前記表示部に表示させる場合、前記コンテンツを示す領域とは異なり、該Ｗｅｂページをスクロールするための操作領域を所定以上のサイズとするよう前記表示部における前記Ｗｅｂページの表示を制御する制御ステップと、
前記Ｗｅｂページのユーザ操作に応じた前記表示部における表示領域であって、前記Ｗｅｂページの第１の表示領域が所定の条件を満たすか否かを判定する判定ステップとを実行させ、
前記判定ステップにて、前記第１の表示領域における前記コンテンツを示す領域に基づいて、前記第１の表示領域において前記操作領域が所定以上のサイズとなるか否かを判定し、
前記制御ステップにて、前記第１の表示領域では前記操作領域が前記所定以上のサイズにならない場合、前記所定以上のサイズの前記操作領域を含む第２の表示領域で前記Ｗｅｂページを表示するよう制御するプログラム。 A computer of an information processing device having a display unit that accepts input of an instruction operation by a touch operation,
a display control step of displaying, on the display unit, a web page having content for accepting input of an instruction operation;
a control step of controlling display of the web page on the display unit so that, when an area including the content of the web page is displayed on the display unit, an operation area for scrolling the web page is set to a size equal to or larger than a predetermined size, which is different from an area showing the content;
a determination step of determining whether a first display area of the Web page on the display unit in response to a user operation of the Web page satisfies a predetermined condition ;
In the determining step, it is determined whether or not the operation area in the first display area has a size equal to or larger than a predetermined size based on an area showing the content in the first display area;
A program that controls, in the control step, to display the web page in a second display area that includes an operation area of a size equal to or larger than the specified size if the operation area in the first display area does not become a size equal to or larger than the specified size .
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| JP2021009332A JP7612433B2 (en) | 2021-01-25 | 2021-01-25 | Information processing device, information processing method, and program |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| JP2021009332A JP7612433B2 (en) | 2021-01-25 | 2021-01-25 | Information processing device, information processing method, and program |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| JP2022113246A JP2022113246A (en) | 2022-08-04 |
| JP7612433B2 true JP7612433B2 (en) | 2025-01-14 |
Family
ID=82657925
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| JP2021009332A Active JP7612433B2 (en) | 2021-01-25 | 2021-01-25 | Information processing device, information processing method, and program |
Country Status (1)
| Country | Link |
|---|---|
| JP (1) | JP7612433B2 (en) |
Citations (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| WO2018025316A1 (en) | 2016-08-01 | 2018-02-08 | 富士通株式会社 | Page display program, page display device, and page display method |
-
2021
- 2021-01-25 JP JP2021009332A patent/JP7612433B2/en active Active
Patent Citations (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| WO2018025316A1 (en) | 2016-08-01 | 2018-02-08 | 富士通株式会社 | Page display program, page display device, and page display method |
Also Published As
| Publication number | Publication date |
|---|---|
| JP2022113246A (en) | 2022-08-04 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN100426206C (en) | improving the display of large objects on small displays | |
| US8302029B2 (en) | Presentation of large objects on small displays | |
| JP4533943B2 (en) | Information processing apparatus, display control method, and program | |
| EP2284679A2 (en) | User interface systems and methods for manipulating and viewing digital documents | |
| US8743150B2 (en) | Display processing device and display control method | |
| US9773072B2 (en) | Systems and methods for developing adaptive layouts for electronic content | |
| KR20130116241A (en) | Branded browser frame | |
| JP5738895B2 (en) | Enhanced application display capabilities | |
| CN111078035A (en) | A Drawing Method Based on HTML5 Canvas | |
| JP5981175B2 (en) | Drawing display device and drawing display program | |
| JP4776995B2 (en) | Computer apparatus and control method and program thereof | |
| JP2013033308A (en) | Information processor, information processor control method, and program | |
| JP4874363B2 (en) | Web page display method using browser plug-in | |
| JP7612433B2 (en) | Information processing device, information processing method, and program | |
| JP2014056357A (en) | Information processing program, display control device, display control system and display method | |
| CN113096217B (en) | Picture generation method and device, electronic equipment and storage medium | |
| JP2004318269A (en) | Image display device, image display method, and image display system | |
| CN111814087B (en) | Dynamic layout method and device of Web window, electronic equipment and readable storage medium | |
| JP5066877B2 (en) | Image display device, image display method, and program | |
| JP7631056B2 (en) | Information processing device, control method, program, and storage medium | |
| CN119414952A (en) | Signal source image cropping method, device and electronic device based on Android device | |
| CN121786285A (en) | Page self-adaptive scaling method and device, equipment and medium thereof | |
| JP2014127082A (en) | Image display device | |
| CN113608659A (en) | Multi-window adjusting method, readable storage medium and electronic device | |
| JP2003157442A (en) | Output processing method, output processing device, output processing program, and recording medium storing output processing program |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| A621 | Written request for application examination |
Free format text: JAPANESE INTERMEDIATE CODE: A621 Effective date: 20240112 |
|
| A131 | Notification of reasons for refusal |
Free format text: JAPANESE INTERMEDIATE CODE: A131 Effective date: 20240730 |
|
| A977 | Report on retrieval |
Free format text: JAPANESE INTERMEDIATE CODE: A971007 Effective date: 20240731 |
|
| A521 | Request for written amendment filed |
Free format text: JAPANESE INTERMEDIATE CODE: A523 Effective date: 20240930 |
|
| TRDD | Decision of grant or rejection written | ||
| A01 | Written decision to grant a patent or to grant a registration (utility model) |
Free format text: JAPANESE INTERMEDIATE CODE: A01 Effective date: 20241126 |
|
| A61 | First payment of annual fees (during grant procedure) |
Free format text: JAPANESE INTERMEDIATE CODE: A61 Effective date: 20241225 |
|
| R150 | Certificate of patent or registration of utility model |
Ref document number: 7612433 Country of ref document: JP Free format text: JAPANESE INTERMEDIATE CODE: R150 |