[{"id":"7720ca38-fc98-4fd8-a3a5-3c0e730c3c72","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"247ded67-b050-4436-be40-fe7b0eeabef7","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"9a8c377f-1f1e-476e-b487-c2339da9bed3","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"5e8e6db2-89b9-4184-bbdc-301ee676869e","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"e04b598e-b0d8-4054-bdac-5143d90b3d51","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"edb028d0-a8cc-42b2-acda-42a5515729f0","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"2adde444-20a6-43d7-8896-2b445877327a","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"6ab8ced2-6c7a-41b6-b861-ba066bd40f40","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"0c34aedd-80a3-470b-a0f6-c327a4346be7","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"717a5892-fa23-499b-a61d-cff228943aaf","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"bd9be971-69fc-4793-ad6d-234be7a93048","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"a1e8d38f-43d8-4b3e-b747-3fbf7656fcd9","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"d6995fdf-76ee-421f-9e7a-3fb324d14bbb","tags":[{"product":null,"links":null,"id":"2f522515-8c88-4017-855d-905bc4b0ea3c","name":"Upd","color":"Blue","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"64fa3155-4543-4acd-83b7-f9860fd46673","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"698413bd-0b16-4287-baec-644d98a411d1","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]},{"id":"7e4393a0-21ef-438b-981b-325b64db5baa","tags":[{"product":null,"links":null,"id":"6c1a6899-1b88-404c-9a73-4a0c6c9090a3","name":"New","color":"Red","productId":"66a69675-7df9-45b2-867a-4ab2613535fa"}]}]
SpreadJSでは、ShapeBaseクラスのallowResize メソッドを使用することで、ワークシート内のシェイプをサイズ変更できます。このメソッドのパラメータには、さまざまなリサイズモードを指定するResizeMode列挙体、またはリサイズを許可するかどうかをブール値で設定します。
ResizeMode列挙体を使用すると、次のいずれかのリサイズモードを設定できます。
縦横比を固定:すべてのサイズ変更ハンドラ(上、下、右、左、左上、右上、左下、右下)を表示します。これにより、縦横比を維持したまますべての方向にシェイプをサイズ変更できます。
横方向:左と右のサイズ変更ハンドラのみを表示し、シェイプを水平方向にサイズ変更できるようにします。
縦方向:上と下のサイズ変更ハンドラのみを表示し、シェイプを垂直方向にサイズ変更できるようにします。
次のサンプルコードは、allowResizeメソッドを使用してシェイプをサイズ変更する方法を示します。
// 縦横比でシェイプをサイズ変更します。
shape2.allowResize(GC.Spread.Sheets.Shapes.ResizeMode.aspect);
// 水平方向にシェイプをサイズ変更します。
shape3.allowResize(GC.Spread.Sheets.Shapes.ResizeMode.horizontal);
// 垂直方向にシェイプをサイズ変更します。
shape4.allowResize(GC.Spread.Sheets.Shapes.ResizeMode.vertical);
シェイプのすべてのサイズ変更ハンドラを無効にして、ユーザーがシェイプのサイズを変更できないようにするには、allowResizeメソッドのパラメータにfalseの値を渡します。シェイプのすべてのサイズ変更ハンドラを有効にするには、allowResizeメソッドのパラメータにtrueの値を渡します。
// シェイプのサイズ変更を無効にします。
shape1.allowResize(false);
次の表は、様々な種類のシェイプと既定のリサイズモードを示します。
シェイプの種類 | 既定値 |
---|---|
シェイプ | true |
グループシェイプ | true |
コネクタシェイプ | true |
フォームコントロール | true |
ピクチャシェイプ | aspect |
カメラシェイプ | aspect |
type=warning
メモ:allowResizeプロパティは、ユーザーインタフェース(UI)の動作にのみ影響します。シェイプの幅と高さのプロパティには影響を与えません。
SpreadJSは、Excelと同様に、Shiftキーを押しながらマウスホイールを動かすことで、シェイプのサイズ変更をサポートします。シェイプのサイズを変更するときに Shiftキーを押すと、シェイプの縦横比が維持されます。この動作は、allowResizeプロパティがtrueに設定されている場合にのみ有効です。
コネクタシェイプのサイズを変更しているときに、別のシェイプ(次の画像に示す組み込みシェイプなど)の近くにマウスホバーすると、そのシェイプの接続点が表示されます。コネクタシェイプは、そのシェイプの最も近い接続点に直接接続されます。
デザイナを使用してシェイプのサイズを変更するには、次の手順を実行します。
シェイプを選択します。
シェイプを右クリックし、コンテキストメニューから[図形の書式設定]を選択します。右側に[図形の書式設定]パネルが表示されます。
パネルの[リサイズモード]を使用して、さまざまなリサイズモードを選択します。