# canvas上のキャラクタを大きく表示させるには？

**URL:** <https://creatorsforum.live2d.com/t/topic/2527>\
**Category:** トラブル報告\
**Tags:** 使い方\
**Created:** [2024 年 4 月 20 日午前 7:22 UTC](https://creatorsforum.live2d.com/t/topic/2527 "2024-04-20T07:22:31Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![あぷぷ](https://avatars.discourse-cdn.com/v4/letter/%E3%81%82/8e8cbc/32.png) [@あぷぷ](https://creatorsforum.live2d.com/u/%E3%81%82%E3%81%B7%E3%81%B7)\
**Post date:** [2024 年 4 月 20 日午前 7:22 UTC](https://creatorsforum.live2d.com/t/topic/2527/1 "2024-04-20T07:22:31Z")

</div>

Cubism SDK For Web（5-r.1）サンプルモデルをビルドし、  
WEBサイトで表示することができました。

例えばサンプルモデルの上半身だけを表示しようとする場合はどのようにすれば良いのでしょうか

Samples/TypeScript/Demo/src/lappdefine.ts  
のパラメタを見ていて  
CanvasSizeがAutoになっていたので500角にしたら全体が潰れたように表示されてしまい

```auto
export const CanvasSize: { width: number; height: number } | 'auto' = {
width: 500,
height: 500,
};

```

ViewScaleを2にすると2倍に拡大はできるものの、

`export const ViewScale = 2.0;`

頭が切れてしまうので、下に下げようと下記２つの値を変えてみても変化がありません

```auto
export const ViewLogicalBottom = -1.0;
export const ViewLogicalTop = 1.0;

```

どこで設定するのでしょうか？

---

<div class="post-metadata">

**Author:** ![obs](https://avatars.discourse-cdn.com/v4/letter/o/c67d28/32.png) [@obs](https://creatorsforum.live2d.com/u/obs)\
**Post date:** [2024 年 4 月 21 日午前 1:03 UTC](https://creatorsforum.live2d.com/t/topic/2527/2 "2024-04-21T01:03:40Z")

</div>

こんにちは。  
モデルの見え方を変更するには、CubismUserModelが持つモデル行列（CubismModelMatrix）を使います。

```auto
// lappdelegate.ts
public run(): void {
  // メインループ
  const loop = (): void => {
    // インスタンスの有無の確認
    if (s_instance == null) {
      return;
    }

    // 時間更新
    LAppPal.updateTime();

    ...

    // NOTE: 変更箇所
    const modelMatrix = LAppLive2DManager.getInstance().getModel(0).getModelMatrix();
    if (modelMatrix != null) {
      // 2倍に拡大
      modelMatrix.scale(2.0, 2.0);

      // 写る位置を上にずらす。
      modelMatrix.setY(-1.0);
    }

    // ループのために再帰呼び出し
    requestAnimationFrame(loop);
  };
  loop();
}

```

以上、お試しください。

---

<div class="post-metadata">

**Author:** ![あぷぷ](https://avatars.discourse-cdn.com/v4/letter/%E3%81%82/8e8cbc/32.png) [@あぷぷ](https://creatorsforum.live2d.com/u/%E3%81%82%E3%81%B7%E3%81%B7)\
**Post date:** [2024 年 4 月 21 日午前 1:20 UTC](https://creatorsforum.live2d.com/t/topic/2527/3 "2024-04-21T01:20:40Z")

</div>

さっそくの回答ありがとうございます！  
無事実現できました！ありがとうございました！

---

<div class="post-metadata">

**Author:** ![obs](https://avatars.discourse-cdn.com/v4/letter/o/c67d28/32.png) [@obs](https://creatorsforum.live2d.com/u/obs)\
**Post date:** [2024 年 4 月 21 日午前 2:43 UTC](https://creatorsforum.live2d.com/t/topic/2527/4 "2024-04-21T02:43:13Z")

</div>

いえいえ！うまくいったようでよかったです。