QGraphicsViewの表示を極める:centerOn()以外の代替メソッド徹底解説

2025-05-27

QGraphicsViewとは

QGraphicsView は、QtのGraphics View Frameworkの一部であり、QGraphicsScene の内容を表示するためのウィジェットです。QGraphicsScene は、図形アイテム(QGraphicsItem)を管理し、そのアイテム間の相互作用を処理する論理的なキャンバスを提供します。QGraphicsView は、このシーンをスクロール可能なビューポートとしてユーザーに表示します。

centerOn() の機能

centerOn() メソッドは、QGraphicsView のビューポートの中心が、シーン内の特定の座標、または特定の QGraphicsItem の中心に一致するようにビューをスクロールします。これにより、ユーザーが注目したいエリアやアイテムを簡単にビューの中心に配置できます。

centerOn() のオーバーロード

centerOn() にはいくつかのオーバーロードがあります。

    • pos で指定されたシーン座標にビューの中心を合わせます。
    • 例: view->centerOn(QPointF(100, 50)); // シーン上の(100, 50)がビューの中心になるようにスクロール
  1. void QGraphicsView::centerOn(const QGraphicsItem *item)

    • item で指定された QGraphicsItem の中心がビューの中心になるようにスクロールします。
    • 例: view->centerOn(myItem); // myItem の中心がビューの中心になるようにスクロール
  2. void QGraphicsView::centerOn(qreal x, qreal y)

    • xy で指定されたシーン座標にビューの中心を合わせます(上記 QPointF のオーバーロードのショートカット)。
    • 例: view->centerOn(100, 50);

centerOn() の挙動と注意点

  • ensureVisible() との違い: centerOn() が指定されたポイントやアイテムを「中心に配置する」ことを目的としているのに対し、QGraphicsView::ensureVisible() は、指定された領域やアイテムが「確実に表示される」ようにすることを目的としています。ensureVisible() は必ずしも中心に配置するわけではなく、必要であればビューポートをスクロールして表示範囲内に収めます。
  • ビューポートの更新: centerOn() を呼び出すと、ビューポートが自動的に更新されます。
  • 境界線付近の挙動: ドキュメントによると、「アイテムが境界線に近い、または境界線の外にある場合、それはビューに表示されますが、必ずしも中央に配置されるわけではありません。」これは、ビューがシーン全体を表示しようとする際に、シーンの端を越えてスクロールできないためです。
  • スクロールバーの調整: centerOn() を呼び出すと、内部的にビューの水平および垂直スクロールバーが調整され、指定されたポイントやアイテムがビューの中心にくるように表示が更新されます。
#include <QApplication>
#include <QGraphicsScene>
#include <QGraphicsView>
#include <QGraphicsRectItem>
#include <QPushButton>
#include <QVBoxLayout>

int main(int argc, char *argv[]) {
    QApplication a(argc, argv);

    // シーンを作成
    QGraphicsScene *scene = new QGraphicsScene();
    scene->setSceneRect(0, 0, 800, 600); // シーンのサイズを設定

    // いくつかのアイテムをシーンに追加
    QGraphicsRectItem *rect1 = new QGraphicsRectItem(0, 0, 50, 50);
    rect1->setBrush(Qt::red);
    scene->addItem(rect1);

    QGraphicsRectItem *rect2 = new QGraphicsRectItem(700, 500, 80, 80);
    rect2->setBrush(Qt::blue);
    scene->addItem(rect2);

    // ビューを作成し、シーンを設定
    QGraphicsView *view = new QGraphicsView(scene);
    view->setRenderHint(QPainter::Antialiasing); // アンチエイリアシングを有効にする

    // UIのセットアップ
    QWidget *window = new QWidget();
    QVBoxLayout *layout = new QVBoxLayout(window);
    layout->addWidget(view);

    QPushButton *centerOnRect1Button = new QPushButton("赤色の四角形を中心に表示");
    QObject::connect(centerOnRect1Button, &QPushButton::clicked, [=]() {
        view->centerOn(rect1); // 赤色の四角形を中心に表示
    });
    layout->addWidget(centerOnRect1Button);

    QPushButton *centerOnRect2Button = new QPushButton("青色の四角形を中心に表示");
    QObject::connect(centerOnRect2Button, &QPushButton::clicked, [=]() {
        view->centerOn(rect2); // 青色の四角形を中心に表示
    });
    layout->addWidget(centerOnRect2Button);

    QPushButton *centerOnPointButton = new QPushButton("シーンの(400, 300)を中心に表示");
    QObject::connect(centerOnPointButton, &QPushButton::clicked, [=]() {
        view->centerOn(400, 300); // シーンの中心に表示
    });
    layout->addWidget(centerOnPointButton);

    window->setWindowTitle("QGraphicsView::centerOn() の例");
    window->resize(800, 600);
    window->show();

    return a.exec();
}


centerOn() を呼び出すタイミングが早すぎる

これは最もよくある問題の一つです。特に、QMainWindow のコンストラクタ内や、ウィジェットがまだ画面に表示されていない段階で centerOn() を呼び出すと、期待通りに機能しないことがあります。

原因
QGraphicsView は、自身が実際に表示され、そのサイズが確定するまで、ビューポートのサイズやシーンの表示範囲を正確に計算できません。centerOn() はこれらの情報に基づいてビューポートをスクロールするため、情報が不正確な状態では意図した結果になりません。

トラブルシューティング

  • showEvent() をオーバーライドする
    ウィジェットの表示イベントハンドラである showEvent() 内で centerOn() を呼び出すこともできます。これにより、ウィジェットが表示される際に確実に処理されます。

class MyGraphicsView : public QGraphicsView { Q_OBJECT public: MyGraphicsView(QGraphicsScene *scene, QWidget *parent = nullptr) : QGraphicsView(scene, parent) {}

protected:
    void showEvent(QShowEvent *event) override {
        QGraphicsView::showEvent(event);
        // 最初の表示時にシーンの中心に合わせる
        centerOn(0, 0);
    }
};
```

シーンのサイズが適切に設定されていない

QGraphicsView は、QGraphicsScenesceneRect を使ってシーンの論理的な境界を決定します。sceneRect が適切に設定されていない場合、centerOn() が期待通りに動作しないことがあります。特に、アイテムを追加しても sceneRect が自動的に調整されない場合、centerOn() の計算がずれる可能性があります。

原因

  • アイテムが sceneRect の外側に配置されている。
  • setSceneRect() が呼び出されていない、または不適切な値が設定されている。

トラブルシューティング

  • itemsBoundingRect() を使用する
    シーン内のすべてのアイテムを含む最小の矩形を取得し、それを sceneRect に設定することもできます。

    scene->setSceneRect(scene->itemsBoundingRect());
    // その後で centerOn() を呼び出す
    view->centerOn(myItem);
    
  • QGraphicsScene::setSceneRect() を明示的に設定する
    シーンの論理的なサイズと位置を正確に指定します。これにより、QGraphicsView はシーンの全体像を把握し、centerOn() がより正確に機能します。

    QGraphicsScene *scene = new QGraphicsScene();
    scene->setSceneRect(-1000, -1000, 2000, 2000); // 例えば、中心が (0,0) で、各辺が1000の範囲
    

アイテムがシーンに登録されていない、または有効でない

centerOn(const QGraphicsItem *item) を使用する場合、そのアイテムが有効であり、かつ目的のシーンに登録されている必要があります。

原因

  • アイテムがシーンから削除された後、centerOn() が呼び出された。
  • アイテムが QGraphicsScene::addItem() でシーンに追加されていない。
  • アイテムが new されていない(スタックに作成され、スコープ外で破棄される)。

トラブルシューティング

  • アイテムのポインタが有効であることを確認する: centerOn() を呼び出す前に、渡すアイテムのポインタが nullptr でないこと、およびアイテムがまだシーンに存在することを確認します。
  • scene->addItem(item) で追加する: アイテムをシーンに追加することを忘れないでください。
  • アイテムをヒープに作成する (new): QGraphicsItem をスタックで作成すると、関数が終了すると同時に破棄されてしまいます。必ず new でヒープに作成し、所有権を適切に管理するか、親を設定してQtのオブジェクトツリーに任せます。

シーンの変換やビューの変換が影響している

QGraphicsViewQGraphicsScene はそれぞれ独自の変換行列(行列変換、スケール、回転など)を持つことができます。これらの変換が複雑に絡み合うと、centerOn() の動作が予期せぬものになることがあります。

原因

  • QGraphicsItem にカスタムの変換が適用されている。
  • QGraphicsView::setTransform()QGraphicsView::scale()QGraphicsView::rotate() などが不適切に設定されている。

トラブルシューティング

  • mapToScene()mapFromScene() を理解する: 複雑な変換がある場合、ビュー座標とシーン座標間のマッピング関数を理解することがデバッグに役立ちます。
  • アイテムの変換を考慮に入れる: centerOn() はアイテムのローカル座標系ではなく、シーン座標系で動作します。アイテムに変換が適用されている場合、その変換後のシーン座標における中心が使われます。
  • ビューの変換をリセットしてテストする: 一時的に view->resetTransform(); を呼び出してから centerOn() を試してみてください。これにより、変換が問題の原因であるかどうかが分かります。

QGraphicsView のアライメント設定

QGraphicsView::setAlignment() は、シーン全体がビューに収まる場合に、ビュー内でシーンがどのように配置されるかを制御します(デフォルトは Qt::AlignCenter)。シーン全体がビューに収まらない場合、centerOn() の動作には影響しませんが、誤解を生む可能性があります。

トラブルシューティング

  • setAlignment() が意図しない設定になっていないか確認します。通常はデフォルトの Qt::AlignCenter で問題ありません。
  • fitInView() との比較: centerOn() が中心に合わせるのに対し、fitInView() は指定された矩形またはアイテムがビューポート内に収まるようにズームとスクロールを行います。問題が解決しない場合、目的によっては fitInView() の方が適していることもあります。

  • qDebug() を活用する:

    • view->rect(): ビューポートのピクセル座標での矩形
    • view->mapToScene(view->rect()).boundingRect(): ビューポートがシーン座標で表示している範囲
    • item->scenePos(): アイテムのシーンにおける位置
    • item->boundingRect(): アイテムのローカル座標系での境界矩形
    • item->mapToScene(item->boundingRect()).boundingRect(): アイテムのシーン座標系での境界矩形
    • scene->sceneRect(): シーンの論理的な境界

    これらの情報を出力することで、ビューとシーンの間の関係性や、アイテムの位置が期待通りになっているかを確認できます。



例1:シーンの特定の座標を中心に表示する

この例では、QGraphicsScene を作成し、その中心(400, 300)に QGraphicsView のビューポートを合わせます。

#include <QApplication>
#include <QGraphicsScene>
#include <QGraphicsView>
#include <QGraphicsRectItem> // 四角形アイテム用

int main(int argc, char *argv[]) {
    QApplication a(argc, argv);

    // 1. QGraphicsScene を作成
    QGraphicsScene scene;
    // シーンの論理的な矩形を設定。広めに設定することで、スクロール範囲が確保されます。
    // 中心が (0,0) の場合、例えば -400, -300 から +400, +300 の範囲
    scene.setSceneRect(0, 0, 800, 600);

    // シーンの中心に何か描画して確認しやすくする
    QGraphicsRectItem *centerRect = new QGraphicsRectItem(390, 290, 20, 20);
    centerRect->setBrush(Qt::red);
    scene.addItem(centerRect);

    // 2. QGraphicsView を作成し、シーンを設定
    QGraphicsView view(&scene);
    view.setWindowTitle("QGraphicsView::centerOn(QPointF) の例");
    view.resize(600, 400); // ビューのウィンドウサイズ

    // 3. シーンの特定の座標を中心に表示
    // この例では、シーンの論理的な中心 (400, 300) をビューの中心に合わせる
    view.centerOn(400, 300);

    view.show();

    return a.exec();
}

解説

  • view.centerOn(400, 300); は、ビューポートの中心がシーン座標の (400, 300) に来るようにビューをスクロールします。この場合、作成した赤い四角形がビューの中心に表示されます。
  • scene.setSceneRect(0, 0, 800, 600); で、シーンが (0,0) から (800,600) の範囲を持つことを定義しています。

例2:特定の QGraphicsItem を中心に表示する

この例では、複数の QGraphicsItem をシーンに追加し、ボタンを押すと特定のアイテムがビューの中心に表示されるようにします。

#include <QApplication>
#include <QGraphicsScene>
#include <QGraphicsView>
#include <QGraphicsEllipseItem> // 楕円アイテム用
#include <QGraphicsRectItem>   // 四角形アイテム用
#include <QPushButton>
#include <QVBoxLayout>
#include <QWidget>

int main(int argc, char *argv[]) {
    QApplication a(argc, argv);

    // 1. QGraphicsScene を作成
    QGraphicsScene *scene = new QGraphicsScene();
    scene->setSceneRect(-500, -500, 1000, 1000); // シーンの広さを設定 (中心が 0,0)

    // 2. いくつかのアイテムをシーンに追加
    QGraphicsRectItem *rectItem = new QGraphicsRectItem(-200, -200, 100, 100);
    rectItem->setBrush(Qt::blue);
    rectItem->setPos(-200, -200); // アイテムのシーン上の位置
    scene->addItem(rectItem);

    QGraphicsEllipseItem *ellipseItem = new QGraphicsEllipseItem(100, 100, 150, 150);
    ellipseItem->setBrush(Qt::green);
    ellipseItem->setPos(100, 100); // アイテムのシーン上の位置
    scene->addItem(ellipseItem);

    // 3. QGraphicsView を作成し、シーンを設定
    QGraphicsView *view = new QGraphicsView(scene);
    view->setRenderHint(QPainter::Antialiasing); // アンチエイリアシングを有効にすると滑らかに表示されます
    view->setWindowTitle("QGraphicsView::centerOn(QGraphicsItem*) の例");

    // 4. UI部品(ボタン)の作成とレイアウト
    QPushButton *centerRectButton = new QPushButton("青い四角形を中心に表示");
    QPushButton *centerEllipseButton = new QPushButton("緑の円を中心に表示");
    QPushButton *centerOriginButton = new QPushButton("シーン原点(0,0)を中心に表示");

    QVBoxLayout *layout = new QVBoxLayout();
    layout->addWidget(view);
    layout->addWidget(centerRectButton);
    layout->addWidget(centerEllipseButton);
    layout->addWidget(centerOriginButton);

    QWidget *window = new QWidget();
    window->setLayout(layout);
    window->resize(800, 600);

    // 5. ボタンと centerOn() メソッドの接続
    QObject::connect(centerRectButton, &QPushButton::clicked, [=]() {
        view->centerOn(rectItem); // 青い四角形を中心に表示
    });

    QObject::connect(centerEllipseButton, &QPushButton::clicked, [=]() {
        view->centerOn(ellipseItem); // 緑の円を中心に表示
    });

    QObject::connect(centerOriginButton, &QPushButton::clicked, [=]() {
        view->centerOn(0, 0); // シーンの原点(0,0)を中心に表示
    });

    window->show();

    return a.exec();
}

解説

  • centerOn(0, 0) は、シーンの原点(中心)をビューの中心に合わせます。
  • centerOn(rectItem)centerOn(ellipseItem) を呼び出すことで、対応するアイテムの中心がビューポートの中心に来るようにスクロールします。
  • scene->setSceneRect(-500, -500, 1000, 1000); は、シーンの座標系が (-500,-500) から (500,500) の範囲を持ち、中心が (0,0) になるように設定しています。

前述のトラブルシューティングで述べたように、QGraphicsView がまだ表示されていない、またはサイズが確定していない状態で centerOn() を呼び出すと問題が発生することがあります。これを避けるための一般的な方法は、QTimer::singleShot(0, ...) を使用することです。

#include <QApplication>
#include <QMainWindow>
#include <QGraphicsScene>
#include <QGraphicsView>
#include <QGraphicsTextItem>
#include <QTimer> // QTimer::singleShot のために必要

class MyMainWindow : public QMainWindow
{
    Q_OBJECT // QObject を継承するクラスには Q_OBJECT マクロが必要

public:
    MyMainWindow(QWidget *parent = nullptr)
        : QMainWindow(parent)
    {
        // 1. シーンとビューの作成
        scene = new QGraphicsScene(this);
        scene->setSceneRect(0, 0, 1000, 800); // 広めのシーンを設定

        view = new QGraphicsView(scene, this);
        setCentralWidget(view); // QMainWindow の中央ウィジェットにビューを設定

        // 2. アイテムをシーンに追加
        QGraphicsTextItem *bigText = new QGraphicsTextItem("Hello, Qt Graphics View!");
        bigText->setFont(QFont("Arial", 48));
        bigText->setPos(100, 100); // シーン上の位置
        scene->addItem(bigText);

        QGraphicsRectItem *targetRect = new QGraphicsRectItem(700, 500, 150, 100);
        targetRect->setBrush(Qt::magenta);
        scene->addItem(targetRect);

        // 3. ウィンドウが表示され、レイアウトが完了した後に centerOn を呼び出す
        // QTimer::singleShot(0, ...) は、現在のイベントループの処理が完了した直後にスロットを呼び出します。
        // これにより、ビューのサイズが確定してから centerOn が実行されます。
        QTimer::singleShot(0, this, [this, targetRect]() {
            // targetRect をビューの中心に表示する
            view->centerOn(targetRect);
            qDebug() << "centerOn() が実行されました。";
        });

        setWindowTitle("QGraphicsView::centerOn() 遅延実行の例");
        resize(800, 600);
    }

private:
    QGraphicsScene *scene;
    QGraphicsView *view;
};

// moc を生成するために必要
#include "main.moc"

int main(int argc, char *argv[]) {
    QApplication a(argc, argv);
    MyMainWindow window;
    window.show();
    return a.exec();
}
  • これにより、centerOn() が実行される時点でビューポートの正確なサイズが利用可能になり、期待通りにアイテムが中心に表示されます。
  • QTimer::singleShot(0, this, [this, targetRect]() { ... }); のラムダ式は、centerOn(targetRect) を呼び出します。0 ミリ秒の遅延は、イベントループの次のサイクルで実行されることを意味し、これにより MyMainWindowQGraphicsView の初期化とレイアウトが完了するのを待ちます。
  • MyMainWindow クラスを作成し、そのコンストラクタ内でシーンとビューを初期化しています。


QGraphicsView::fitInView()

centerOn() が「中心に合わせる」ことに特化しているのに対し、fitInView() は指定された矩形やアイテムが「ビューポート内に収まる」ようにズームとスクロールを調整します。

特徴

  • 用途: シーン全体、特定の大きな領域、または特定のアイテムが画面全体に表示されるようにしたい場合に最適です。
  • アスペクト比の保持: Qt::KeepAspectRatio フラグなどを指定することで、元のアイテムのアスペクト比を保ちつつ、ビューに収めることができます。
  • ズームも調整: 指定された領域がビューポートにぴったり収まるように、ビューのスケール(ズームレベル)も調整します。

使用例

// シーン全体をビューに収める
view->fitInView(scene->sceneRect(), Qt::KeepAspectRatio);

// 特定のアイテムがビューに収まるようにズームとスクロール
view->fitInView(myItem, Qt::KeepAspectRatio);

// 指定した矩形をビューに収める
QRectF targetRect(100, 100, 300, 200); // シーン内の矩形
view->fitInView(targetRect, Qt::KeepAspectRatio);

QGraphicsView のスクロールバーを直接操作する

QGraphicsViewQAbstractScrollArea を継承しているため、そのスクロールバーにアクセスして手動でスクロール位置を制御できます。

特徴

  • 用途: 特定のオフセットでビューを移動させたい場合や、独自のスクロールロジックを実装したい場合に有用です。
  • アニメーション: QPropertyAnimation などと組み合わせることで、カスタムのスムーズなスクロールアニメーションを実装できます。
  • 細かい制御: ピクセル単位で正確なスクロール位置を設定できます。

使用例

// 水平スクロールバーを取得し、値を設定
QScrollBar *hBar = view->horizontalScrollBar();
hBar->setValue(hBar->maximum() / 2); // 水平方向を中央に

// 垂直スクロールバーを取得し、値を設定
QScrollBar *vBar = view->verticalScrollBar();
vBar->setValue(vBar->maximum() / 2); // 垂直方向を中央に

// 特定のシーン座標 (x, y) がビューポートの左上に来るようにスクロール
// ただし、この計算はビューの現在のスケールと変換に依存します。
// より正確な計算は以下のようになります。
QPointF scenePoint(100, 100);
QPointF viewPoint = view->mapFromScene(scenePoint);

// ビューポートの左上を目的のシーン座標に合わせる
view->horizontalScrollBar()->setValue(view->horizontalScrollBar()->value() + viewPoint.x());
view->verticalScrollBar()->setValue(view->verticalScrollBar()->value() + viewPoint.y());

// または、scroll() メソッドを使用する(ただし、これは相対的な移動)
// view->scroll(dx, dy);

注意点

  • setValue() で設定する値は、ビュー座標系でのスクロールバーの位置に対応します。
  • QGraphicsView のスクロールバーの範囲は sceneRect とビューポートのサイズによって動的に決定されます。

ビューの変換行列を直接操作する

QGraphicsView は内部的に QTransform を使用してシーンを変換し、ビューポートに表示します。この変換行列を直接操作することで、パン(平行移動)、ズーム、回転などを細かく制御できます。

特徴

  • 用途: カスタムのナビゲーション(例:マウスドラッグによるパン、マウスホイールによるズーム)を実装する場合に適しています。
  • 高性能: 一度変換を設定すれば、すべての描画に適用されます。
  • 柔軟性: ズーム、回転、パンなど、あらゆる種類の変換を組み合わせることができます。

関連メソッド

  • view->rotate(qreal angle): 回転
  • view->scale(qreal sx, qreal sy): スケールを変更(ズーム)
  • view->translate(qreal dx, qreal dy): 相対的に平行移動
  • view->setTransform(const QTransform &matrix): 新しい変換行列を設定
  • view->transform(): 現在の変換行列を取得

centerOn() の代替としての使用例(手動パン)
centerOn(QPointF pos) のロジックは、実際にはビューポートの中心が pos に来るようにビューの変換行列を調整することと等価です。手動でこれを行うには、現在のビューポートの中心を pos に移動させるためのオフセットを計算し、translate を適用します。

// 例: シーンの (100, 50) をビューの中心に持ってくる
QPointF targetScenePoint(100, 50);

// ビューポートの現在の中心をシーン座標にマッピング
QPointF currentViewCenterInScene = view->mapToScene(view->viewport()->rect().center());

// 目的の点と現在のビュー中心の差を計算
QPointF delta = targetScenePoint - currentViewCenterInScene;

// その差分だけビューを平行移動させる
// 注意: translate は相対的な移動なので、複数回呼び出すと累積されます
view->translate(delta.x(), delta.y());

// または、新しい変換行列を構築して設定する(より制御が容易)
QTransform currentTransform = view->transform();
QTransform newTransform = currentTransform.translated(delta.x(), delta.y());
view->setTransform(newTransform);

より制御されたパン操作
マウスドラッグによるパン機能は、現在の変換行列を基準にして translate を呼び出すことで実装されます。

// (カスタム QGraphicsView サブクラス内)
void MyCustomView::mousePressEvent(QMouseEvent *event) {
    if (event->button() == Qt::LeftButton) {
        lastPanPoint = event->pos(); // マウスが押された位置を記録
        event->accept();
    } else {
        QGraphicsView::mousePressEvent(event);
    }
}

void MyCustomView::mouseMoveEvent(QMouseEvent *event) {
    if (event->buttons() & Qt::LeftButton) {
        QPointF delta = mapToScene(event->pos()) - mapToScene(lastPanPoint);
        translate(delta.x(), delta.y()); // ビューを移動
        lastPanPoint = event->pos();
        event->accept();
    } else {
        QGraphicsView::mouseMoveEvent(event);
    }
}

これは centerOn() と似ていますが、目的が異なります。ensureVisible() は、指定されたシーンの矩形またはアイテムが「確実にビューポート内に表示される」ようにスクロールします。必ずしも中心に配置するわけではありません。

特徴

  • 用途: 特定の要素がユーザーから見えていれば十分で、必ずしも中心にある必要がない場合に有用です。
  • ズームは調整しない: スケールは変更せず、スクロールのみを行います。
  • 可視性の保証: アイテムが一部でも画面外にある場合、スクロールして表示範囲内に収めます。
// 特定のアイテムがビューポートに表示されるようにスクロール
view->ensureVisible(myItem);

// シーンの特定の矩形が表示されるようにスクロール
QRectF areaToSee(50, 50, 200, 100);
view->ensureVisible(areaToSee);

// オフセットを指定して、アイテムの周囲に余白を持たせる
// (x, y, width, height) の矩形がビューポートに収まるようにする
qreal x_margin = 10;
qreal y_margin = 10;
view->ensureVisible(myItem, x_margin, y_margin);
メソッド目的スケール調整スクロール調整
centerOn()指定の要素をビューの中心に配置するしないする
fitInView()指定の要素をビューポートに収めるするする
スクロールバー操作スクロール位置を直接数値で設定するしないする
変換行列操作 (translate)ビューを相対的にパン(平行移動)するしないする
ensureVisible()指定の要素がビューポート内に表示されるようにするしないする