Web Tips Plus: 12月 2015

https://forums.adobe.com/thread/1258268

Selecting or highlighting node or mesh by button using javascript

LOD_PROJECTS 2013/07/19 8:32

Hi

I have 3D pdf model with node 1001 or mesh name 2002 and when I klick
it by mouse on 3D view it is highlighted and get orange boundary box.

I have created button name 1001 button and I would like to add to this
button javascript function which will highlight this node or mesh in
the same way as click on those.

I found in discusion some way of make it for example red by changing
rendering mode to illustration but it is not what I am trying to do. I
asking if it is possible just select from button using name of node or
mesh. if you have any exmaple of script i will be very pleased.

1555 閲覧
タグ: 3d
3d でタグ付けされたコンテンツ
, javascript
javascript でタグ付けされたコンテンツ
, button
button でタグ付けされたコンテンツ
, 3dpdf
3dpdf でタグ付けされたコンテンツ
, model_tree
model_tree でタグ付けされたコンテンツ
, 3d_pdf
3d_pdf でタグ付けされたコンテンツ
返信する

Translate

平均ユーザー評価: 評価なし (0 評価)
平均ユーザー評価
評価なし
(0 評価)
評価:
評価劣っている(1 ： 5)評価平均以下(2 ： 5)評価平均(3 ： 5)評価平均以上(4 ： 5)評価優れている(5 ： 5)

1. Re: Selecting or highlighting node or mesh by button using javascript

mrfale67 2013/07/19 11:58 (LOD_PROJECTS への返信)

See what I was answered here:

http://forums.adobe.com/thread/1224570?tstart=0

Otherwise, if you know the name, simply use getByName().

I think what you are looking for may be the wireframeColor property
but I have never experienced it directly. Should you find how to
replicate the selection orange boundary box, please share the solution
with us.

「いいね!」 0 件の「いいね!」を表示(0)

返信する

アクション
Translate

2. Re: Selecting or highlighting node or mesh by button using javascript

LOD_PROJECTS 2013/07/19 15:28 (mrfale67 への返信)

thanks for answer.

It is not what I want to do

I have 5 layer and on each layer I have one node and under neath one mesh.

I would like to select node or mesh by clicking button created on page
not by clicking in 3d model or Model Tree. Like below bottles are
selected (highlighted).

NowI doing it like that:

BUTTON 1-----------------------------------------------

myAnnotObj = getAnnots3D(0)[0].context3D;
myAnnotObj.scene.defaultRenderOptions.illustrationRenderModeFaceColor.set(
1, 0, 0 );

for (var i = 0; i < myAnnotObj.scene.meshes.count; ++i)
{
mesh = myAnnotObj.scene.meshes.getByIndex(i);
mesh.renderMode = "solid";
}
HighlObj = myAnnotObj.scene.meshes.getByName("1001");
HighlObj.renderMode = "illustration";

---------------------------------------------------------------

BUTTON 2-----------------------------------------------

myAnnotObj = getAnnots3D(0)[0].context3D;
myAnnotObj.scene.defaultRenderOptions.illustrationRenderModeFaceColor.set(
1, 0, 0 );

for (var i = 0; i < myAnnotObj.scene.meshes.count; ++i)
{
mesh = myAnnotObj.scene.meshes.getByIndex(i);
mesh.renderMode = "solid";
}
HighlObj = myAnnotObj.scene.meshes.getByName("2002");
HighlObj.renderMode = "illustration";

---------------------------------------------------------------

in this method I have to clean old selection in the loop doing this
render mode back to solid. In the same time my selection not working
at all in render mode illustration. So I would like to find how to
select like in picture from button in document. by script.

「いいね!」 0 件の「いいね!」を表示(0)

返信する

アクション
Translate

3. Re: Selecting or highlighting node or mesh by button using javascript

mrfale67 2013/07/20 0:53 (LOD_PROJECTS への返信)

I think you are doing well.

Things I would try:

1) "for (var i = 0; i < myAnnotObj.scene.meshes.count; ++i)": I have
never seen "++i" but "i++"; are you sure you are parsing all meshes?
just try a "console.println("Mesh name " + mesh.name)" within the loop
to check for this; this way, you will also be assured of your mesh
name;

2) the reset loop is fine but I would also try "renderMode =
'default'" instead of "solid";

3) mesh obj has also a "material" property: in particular check
against "diffuseColor, diffuseTexture, emissiveColor, emissiveTexture,
opacityTexture"; I have heard they should be considered when dealing
with rendering;

let us know your progress

「いいね!」 0 件の「いいね!」を表示(0)

返信する

アクション
Translate

4. Re: Selecting or highlighting node or mesh by button using javascript

Dave Merchant 2013/07/20 3:21 (mrfale67 への返信)

Why is everyone trying to change the visual appearance of the model?

LOD_PROJECTS wants to set the active selection, so just do that:

scene.selectedNode = scene.meshes.getByName(' something' );

「いいね!」 0 件の「いいね!」を表示(0)

返信する

アクション
Translate

5. Re: Selecting or highlighting node or mesh by button using javascript

LOD_PROJECTS 2013/07/20 8:09 (Dave Merchant への返信)

Hi Dave,

Thank you that is exactly what I want and it works. Awesome.

mrfale67

After dave tip I shorten script in button from those above to:

myAnnotObj = getAnnots3D(0)[0].context3D;

myAnnotObj.scene.selectedNode = myAnnotObj.scene.meshes.getByName("1001");

and more in next button I can change rendering to illustration and
selected object is still selected.

many thanks guys

「いいね!」 0 件の「いいね!」を表示(0)

返信する

アクション
Translate

2015年12月21日月曜日

分子構造を 3D で観察しよう (3)：新しい見せ方 | Chem-Station (ケムステ)

http://www.chem-station.com/blog/2015/03/jmol-pdb-03.html

jQuery DOM要素の生成

【jQuery】DOM要素の生成 - Qiita

http://qiita.com/kazu56/items/8e92d08fd1bba0a2d771

HTMLの属性も設定

$("<a></a>", {    href: "abc.html",    target: "_blank",    "class": "myClass"  });

1.8からはjQueryメソッドを指定することができるらしい。これは便利！

1.8からはjQueryメソッドも設定できる

$("<div></div>", {    width: 100,    height: 100,    css: {border: "5px solid gray"},    addClass: "my-div",    on: {      click: function(event) {        // イベント設定      }    }  });

参考：jQuery入門道場

ブラウザウィンドウをリサイズした際のコールバックを設定可能にするjQueryプラグイン「ResizeEnd」 | BlackFlag

http://black-flag.net/jquery/20151020-5801.html

Amazon Linuxの特徴とCentOSとの違いまとめ

Amazon Linuxの特徴とCentOSとの違いまとめ｜ Developers.IO

http://dev.classmethod.jp/cloud/aws/amazon-linux-centos-rhel-difference/

2015年12月17日木曜日

CSS 上付き下付き文字（sup, sub）でline-heightが広がるのを防ぐ

subやsupでline-heightがズレるのを防ぐCSS - いかりんぐ IKA-ring.net

http://ika-ring.net/blog/sub_su/

sup,

sub {

height: 0;

line-height: 1;

vertical-align: baseline;

_vertical-align: bottom;

position: relative;

}

sup {

bottom: 1ex;

}

sub {

top: .5ex;

}

</style>

react.js - React記事まとめ

reactjs - Reactを始めてから今までにお世話になった記事 - Qiita

http://qiita.com/syossan27/items/885813dc5405796197d7

2015年12月16日水曜日

JavaScript - デスクトップを録画するアプリを書いた - Qiita

http://qiita.com/k0sukey/items/63bb968b708cf7c8ce9b

MVC (iOS)

これが最強のMVC(iOS) - Qiita

http://qiita.com/koitaro/items/b3a924245fd72f22871a

2015年12月15日火曜日

GoogleアナリティクスのレポートをGoogleスプレッドシートで自動化

Googleアナリティクスの面倒なレポート作成をGoogleスプレッドシートで解消！（第1回） | Googleアナリティクスのレポートをサクッと自動化！ | Web担当者Forum

http://web-tan.forum.impressrd.jp/e/2015/12/08/21570

高度な分析に役立つ！ GoogleアナリティクスAPIでよく使う軸・指標、セグメントを紹介（第2回） | Googleアナリティクスのレポートをサクッと自動化！ | Web担当者Forum

http://web-tan.forum.impressrd.jp/e/2015/12/15/21593

2015年12月12日土曜日

jQuery - テキストフィールドがEnterキーでサブミットされるのを防ぐ - Qiita

http://qiita.com/awakia/items/17457d6b1809dd803413

Fwd: jQuery input エンターキーが押された時に何かする

エンターキーが押された時に何かする | 主にjQueryのメモ
http://elearn.jp/jmemo/jquery/memo-250.html

$( '#addr' ).keypress( function ( e ) {
if ( e.which == 13 ) {
// ここに処理を記述
return false;
}
} );

jQuery input エンターキーが押された時に何かする

エンターキーが押された時に何かする | 主にjQueryのメモ
http://elearn.jp/jmemo/jquery/memo-250.html

2015年12月11日金曜日

Javascript：locationオブジェクトでURL情報を取得する | raining

var hash = location.hash;
alert(hash);

http://raining.bear-life.com/javascript/location%E3%82%AA%E3%83%96%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88%E3%81%A7url%E6%83%85%E5%A0%B1%E3%82%92%E5%8F%96%E5%BE%97%E3%81%99%E3%82%8B

2015年12月9日水曜日

XSERVER で git を使う [Tipsというかメモ]

XSERVER で git を使う [Tipsというかメモ]
http://tm.root-n.com/server:xserver:git_setup

WordPress と Facebook を効果的に連携させるための４つの方法

WordPress と Facebook を効果的に連携させるための４つの方法
http://bazubu.com/how-to-connect-wp-to-fb-23544.html

2015年12月7日月曜日

jQueryのメモリーリークの傾向と対策

jQueryのメモリーリークの傾向と対策 — KaoriYa

http://www.kaoriya.net/blog/2014/03/28/

2015年12月5日土曜日

CSS - iOSでbodyにoverflow: hiddenが効かないとき - Qiita

http://qiita.com/nantekkotai/items/15882159e7e39c207d59

◉ Sent from my iPhone

2015年12月4日金曜日

iOS Safari スクロールバーカスタマイズ

iPhoneやAndroidのサイトでスクロールバーをカスタマイズ | スターフィールド株式会社

http://sterfield.co.jp/designer/iphone%E3%82%84android%E3%81%AE%E3%82%B5%E3%82%A4%E3%83%88%E3%81%A7%E3%82%B9%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB%E3%83%90%E3%83%BC%E3%82%92%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA.html

-webkit-scrollbarの説明

.element{ /* 対象となる要素のクラス名が"element"の場合 */
overflow: auto;
}
.element::-webkit-scrollbar{ /* スクロールバー本体 */
width: 5px;
background: #9aadfc;
}
.element::-webkit-scrollbar:horizontal{ /* 横方向のスクロールバー本体 */
width: 5px;
background: #9aadfc;
}
.element::-webkit-scrollbar-thumb{ /* スクロールバーの動く部分 */
background: #435295;
border-radius: 2px;
}
.element::-webkit-scrollbar-thumb:horizontal{ /* 横方向のスクロールバーの動く部分 */
background: #435295;
border-radius: 2px;
}
.element::-webkit-scrollbar-track-piece:start{ /* スクロールバーの動く部分の前 */
background: #9aadfc;
}
.element::-webkit-scrollbar-track-piece:end{ /* スクロールバーの動く部分の後ろ */
background: #a3d2a0;
}
.element::-webkit-scrollbar-corner{ /* スクロールバー角 */
background: transparent;
}

なめらかスクロールは、以下のようします。

-webkit-overflow-scrolling: touch

-webkit-overflow-scrolling に指定する値は「auto」と「touch」の2 つです。

「auto」はデフォルトで、慣性スクロールしません。

ただ、慣性スクロールさせると、スクロールバーデザインのカスタマイズが無効になってしまいます。

同時には使えないようです。

例

.content {

height: 200px;

overflow: scroll;

-webkit-overflow-scrolling: touch

}