PowerSketch/Viewerサポート > PowerSketch/Viewerの制御について > Javascriptによる制御例

Javascriptによる制御例

JavaScriptにより、Internet Explorer上でPowerSketch/Viewerを制御することができます。

制御サンプル
サンプルをご用意いたしましたので、実際に操作しながらご確認ください。
また、ソースをご利用いただくこともできます。

プロパティ制御

イベント制御

視点切替制御
ビューワーデータに登録済みの視点への切替をJavaScriptの制御により行うことができます。
  1. 基本ソースにターゲットとなるビューワーデータのIDを指定します。 このIDは任意に設定可能で、1ページに複数のデータを表示する場合は異なるIDを設定してください。

<object
classid="clsid:142843F9-F0BD-11D3-8228-00C04F7A9C5D"
width="300" height="200" id="psv1">
<param name="Source" value="../chair.psv">
</object>

  1. 以下のメソッドを使用して記述します。 ビューワーID.SetViewID(引数) SetViewID = 登録された視点に切り替えます 。
    引数 = 登録順の視点番号を設定します。
サンプルソース1.

ID=psv1のビューワーデータに対し、テキスト「視点1」をクリックした時に1番目(引数)の視点に変更する。

<a href=# onClick="psv1.SetViewID(1)">視点1</a>

サンプルソース2.

ID=psv1のビューワーデータに対し、画像データ「view3.gif」をクリックした時に3番目(引数)の視点に変更する。

<a><img src="view3.gif" onClick="psv1.SetViewID(3)"
alt="視点3"></a>

テクスチャを変更する
PowerSketch/ViewerではJavaScriptの制御により、InternetExplorer上で表示の際、ビューワーデータ内のテクスチャを変更することができます。
この機能により、ビューワーデータ内の製品のカラーや内装材の変更等にご利用いただけます。
  1. 基本ソースにターゲットとなるビューワーデータのIDを指定します。
    このIDは任意に設定可能で、1ページに複数のデータを表示する場合は異なるIDを設定してください。

<object
classid="clsid:142843F9-F0BD-11D3-8228-00C04F7A9C5D"
width="300" height="200" id="psv1">
<param name="Source" value="../sofa-table.psv">
</object>

  1. アクションを起こす画像やテキストに対し、以下のメソッドを使用して記述します。
    ビューワーID.ChangeTexture(引数1.引数2);ビューワーID.Draw(引数3) ChangeTexture = テクスチャ画像を入れ替え
    引数1 = PSV変換ログのテクスチャ番号を設定
    引数2 = 入れ替える画像のファイル指定
    Draw = 表示の更新
    引数3 = ポリゴンとテクスチャの表示画質を指定
    (詳細はメソッド一覧を参照)
サンプルソース1.

ID=psv1のビューワーデータに対し、yuka.jpgという画像をクリックした時に、テクスチャ1番をyuka.jpgに変更する。

<img src="image/yuka.jpg" width="32" height="32" onClick="psv1.ChangeTexture(1,'image/yuka.jpg');psv1.Draw(4)">

サンプルソース2.

ID=psv1のビューワーデータに対し、テキストBlueをクリックした時に、テクスチャ3番をblue.jpgに変更する。

<a href="#" onClick="psv1.ChangeTexture(3,'image/blue.jpg');psv1.Draw(4)
"> Blue</a>

<注意>
  • テクスチャの変更を行う場合は、変更したい形状にPowerSketch、PowerSketch/Real for SolidWorksでテクスチャが設定されている必要があります。
  • 入れ替えに使用できる画像データはJPEGのみです。
形状を選択する
PowerSketch/ViewerではJavaScriptの制御により、ビューワーデータ内の形状を選択しアクションを起こすことができます。
この機能により、ビューワーデータ内の形状を選択して、説明ページを開く、説明文を表示する等にご利用いただけます。
  1. 選択したい形状に対し、識別番号を設定したビューワーデータを作成します。

<例:PowerSketchの場合>
ビューワー変換前に、psrデータ上で形状を選択し「ビューワー用の形状設定」で「形状の識別」「識別番号」を設定しビューワー変換を行います。
詳しくは、マニュアル第4章「ウォークスルー設定」をご覧ください。

  1. 基本ソースにターゲットとなるビューワーデータのIDを指定します。
サンプルソース1.

このIDは任意に設定可能で、1ページで複数のデータを制御する場合は異なるIDを設定してください。

<object
classid="clsid:142843F9-F0BD-11D3-8228-00C04F7A9C5D"
width="300" height="200" id="psv1">
<param name="Source" value="../sofa-table.psv">
</object>

  1. 以下のメソッドと必要に応じたイベント(今回はウィンドウを開く)を記述します。
    メソッド : ビューワーID.GetPickID(引数)
    GetPickID = 形状の識別番号を取得します。
    「引数 = false」を設定するとマウスクリックで選択された形状の識別番号を返します。
    「引数= true」を設定するとマウスカーソル上の形状の識別番号を返します。
サンプルソース2.

ID=psv1のビューワーデータに対し、識別番号1、識別番号2の形状をクリックすると新しいウィンドウが開く。

<HTML>
<HEAD>
<TITLE></TITLE> <script language="JavaScript">
<!-- (新規ウィンドウを開くイベント定義)
function newwin(url) {
window.open(url,"new","width=230,height=200,
toolbar=no,location=no,status=no,menubar=no,scrollbars=no")
}     (形状識別のイベントとメソッド)
function Pick(){
timer=setTimeout("Pick()",500);
id=psv1.GetPickID(false);
if(id<1)return;
switch(id)
{
case 1:newwin("page/item1.html");break;  (識別番号1に対するイベント)
case 2:newwin("page/item2.html");break;   (識別番号2に対するイベント)
}
}
//-->
</script>
</HEAD> <BODY onLoad="Pick()">  (ページ読込み完了後のイベントハンドラ) <CENTER>
<OBJECT classid=clsid:142843F9-F0BD-11D3-8228-00C04F7A9C5D height=250 width=340 id=psv1>
<PARAM NAME="Source" VALUE="sofa-table.psv">
</OBJECT>
</CENTER>
</BODY>
</HTML>

<注意>
  • 新しいウィンドウが開くというアクションは一例です。形状選択時のアクションはJavaScriptのイベント定義により様々な設定が可能です。
  • タイマーの指定時間は任意に変更して構いません。
  • PowerSketch/Real for SolidWorksを使用する場合は、形状識別番号の設定方法が異なります。
  • PowerSketch/Real for SolidWorksで設定可能な、部分識別番号に対する設定は上記方法と異なります。