Data Explorer 以外にも、Fusion Data、改め Manufacturing Data Model（MFG Data Model） の GraphQL を利用するサンプルが用意されています。GitHub – autodesk-platform-services/aps-fusion-data-samples です。この Github リポジトリは、APS ポータルの Manufacturing Data Model ドキュメントにある Code Samples セクションにある内容を実装したリポジトリになっています。
ここでは、リポジトリの内容をローカル環境で実行出来るよう、(手順が重複するので）次の内容について、セットアップのと実行の手順をご紹介しておきます。
なお、サンプルの実行にはサーバー実装に Node.js を、リポジトリのローカル環境へのクローンには Git コマンドを使用します。事前に Node.js と Git for Windows をインストールしてください。それぞれの入手先やインストールについては、APS の開発環境 でもご紹介していますので、必要に応じてご確認ください。
- APS API を利用するアプリの登録とキーの取得 の手順で開発に必要なデベロッパーキー（アプリの登録）を取得してください。 この際、Fusion Data サンプルは 3-legged OAuth で認可プロセスを実行するので、コールバック URL（Callback URL）には、http://localhost:8080/callback/oauth を指定する必要があります。
- コマンドプロンプトを起動して、CD コマンドでリポジトリをクローンしたいフォルダに移動したら、git clone https://github.com/autodesk-platform-services/aps-fusion-data-samples と入力して、リポジトリをローカル環境にクローンします。
- クローンが正常に実行されると、aps-fusion-data-samples フォルダが作成されているはずです。
Fusion Data は Autodesk Data Model のうち、製造業向けの MFG Data Model（Manufacturing Data Model）の粒状データにアクセスします。現状、クラウド上に保存されている Fusion 360 のデザイン データと関連が対象です。実際には、Fusion Team 内のユーザ所有領域へアクセスすることになります。
Fusion Data のアクセスは、Data Management API で Fusion Team にアクセスするのと同様、Hub、Project、Folder といったデータ構造を把握する必要があります。ただ、Data Management API が複数のエンドポイントでデータ構造やキーとなる Id を取得していくのと異なり、GraphQL では一度にクエリ出来る利点があります。ここでは、Hub、Project 等の名前が分かれば十分です。
Fusion 360 のデータパネルから「Open on the Web」をクリックすると、Fusion Team が開き、キーとなる名前を把握する事が出来ます。
Read Model Hierarchy of a Design（デザインのモデル階層の読み取り）設定手順と実行
- aps-fusion-data-samples フォルダ直下に 1.Read the Complete Model Hierarchy of a Design フォルダがクローンされています。コマンドプロンプトで、CD コマンドを実行して 1.Read the Complete Model Hierarchy of a Design フォルダに移動後、npm install と入力して Node.js パッケージをインストールします。
- 1.Read the Complete Model Hierarchy of a Design フォルダ直下の index.js をテキスト エディタで開いて、
‘<YOUR_CLIENT_ID>’、'<YOUR_CLIENT_SECRET>’、'<YOUR_HUB_NAME>’、
‘<YOUR_PROJECT_NAME>’、'<YOUR_COMPONENT_NAME>’
のシングル クォーテーション内の文字列を、共通設定と手順 と アクセス対象のデータ の内容から、それぞれ適切な内容に置き換えて index.js を上書き保存し ます。（下図では ‘<YOUR_CLIENT_ID>’ と ‘<YOUR_CLIENT_SECRET>’ をぼかしています。）
- コマンドプロンプトの npm start と入力して Web サーバーを起動します。
- Web ブラウザを起動後、URL 欄に localhost:8080 と入力してリターンキーを押下します。
- index,js に設定した Hub にアクセス可能な Autodesk Id でサインインします。正しくアクセスが出来ると、ブラウザ画面に「Got the access token. You can close the browser!」と表示されます。
- index.js で指定したプロジェクト内のコンポーネント情報がクエリされて、コマンドプロンプトに Fusion 360 のコンポーネント一覧が表示されます。
ここで実行されるクエリは、1.Read the Complete Model Hierarchy of a Design フォルダ直下の app.js 下部にある次の GraphQL です。
async getModelHierarchy(hubName, projectName, componentName) {
try {
let response = await this.sendQuery(
`query GetModelHierarchy($hubName: String!, $projectName: String!, $componentName: String!) {
hubs(filter:{name:$hubName}) {
results {
name
projects(filter:{name:$projectName}) {
results {
name
rootFolder {
items(filter:{name:$componentName}) {
results {
… on Component {
name
tipVersion {
id
name
modelOccurrences {
results {
componentVersion {
id
name
}
}
}
}
}
}
}
}
}
}
}
}
}`,
{
hubName,
projectName,
componentName
}
)
let rootComponentVersion = this.getComponentVersion(
response, hubName, projectName, componentName
);
let componentVersions = {};
componentVersions[rootComponentVersion.id] = rootComponentVersion;
await this.getSubComponents(componentVersions, rootComponentVersion.modelOccurrences.results);
return {
rootId: rootComponentVersion.id,
componentVersions: componentVersions
};
} catch (err) {
console.log("There was an issue: " + err.message)
}
}Get the Thumbnail of a Part（特定パーツのサムネイル画像の取得）設定手順と実行
- aps-fusion-data-samples フォルダ直下に 3.Find the Thumbnail of a specific Part フォルダがクローンされています。コマンドプロンプトで、CD コマンドを実行して 3.Find the Thumbnail of a specific Part フォルダに移動後、npm install と入力して Node.js パッケージをインストールします。
- 1.Read the Complete Model Hierarchy of a Design フォルダ直下の index.js をテキスト エディタで開いて、'<YOUR_CLIENT_ID>’、'<YOUR_CLIENT_SECRET>’、'<YOUR_HUB_NAME>’、'<YOUR_PROJECT_NAME>’、'<YOUR_COMPONENT_NAME>’ のシングル クォーテーション内の文字列を、共通設定と手順 と アクセス対象のデータ の内容から、それぞれそれぞれ適切な内容に置き換えて index.js を上書き保存し ます。（下図では ‘<YOUR_CLIENT_ID>’ と ‘<YOUR_CLIENT_SECRET>’ をぼかしています。）
- コマンドプロンプトの npm start と入力して Web サーバーを起動します。
- Web ブラウザを起動後、URL 欄に localhost:8080 と入力してリターンキーを押下します。
- index,js に設定した Hub にアクセス可能な Autodesk Id でサインインします。正しくアクセスが出来ると、ブラウザ画面に「Got the access token. You can close the browser!」と表示されます。
- 指定したプロジェクト内のコンポーネントのサムネイル画像がクエリされて、3.Find the Thumbnail of a specific Part フォルダ下に thumbnail.png ファイルがダウンロードされます。
- thumbnail.png を開くと、当該コンポーネントのサムネイル画像を確認することが出来ます。
ここで実行されるクエリは、3.Find the Thumbnail of a specific Part フォルダ直下の app.js 下部にある次の GraphQL です。
async downloadThumbnail(hubName, projectName, componentName) {
try {
while (true) {
let response = await this.sendQuery(
`query GetThumbnail($hubName: String!, $projectName: String!, $componentName: String!) {
hubs(filter:{name:$hubName}) {
results {
projects(filter:{name:$projectName}) {
results {
rootFolder {
items(filter:{name:$componentName}) {
results {
… on Component {
tipVersion {
thumbnail {
status
mediumImageUrl
}
}
}
}
}
}
}
}
}
}
}`,
{
hubName,
projectName,
componentName
}
)
let thumbnail = this.getComponentVersionThumbnail(
response, hubName, projectName, componentName
);
if (thumbnail.status === "SUCCESS") {
// If the thumbnail generation finished then we can download it
// from the url
let thumbnailPath = path.resolve('thumbnail.png');
await this.downloadImage(thumbnail.mediumImageUrl, thumbnailPath);
return "file://" + encodeURI(thumbnailPath);
} else {
console.log("Extracting thumbnail … (it may take a few seconds)")
// Let's wait a second before checking the status of the thumbnail again
await new Promise(resolve => setTimeout(resolve, 1000));
}
}
} catch (err) {
console.log("There was an issue: " + err.message)
}
}By Toshiaki Isezaki
You must be logged in to post a comment.