カスタムマップ設定
配置、スケール、および背景画像は、デバイス上の各保存された地図ごとに独立して設定できます。
これらの設定は、地図リストから地図を選択してビジュアルエディターで設定するか、YAML構成でmap_configプロパティを使用して設定できます。
地図設定オプション
map_config内の設定は、map_1、map_2などのキーを使用して各地図インデックスに適用されます。特定の地図の下で、以下のオプションのいずれかを定義できます：
警告
地図インデックスは作成順に割り当てられ、最も古い地図が最も小さいインデックス（1から開始）を受け取ります。ただし、複数の地図とその構成があるデバイスでマルチフロア地図機能が無効になっている場合、現在アクティブな地図は自動的にインデックス1に再割り当てされます。これは、以前に別のインデックスで設定された地図が突然 map_1.
rotation：マップデータ内で設定された回転を上書きして、このカード専用のカスタム回転でマップを描画します。許容値は0、90、180、または270です。scale：マップの元のサイズとカードのサイズの差に基づく自動スケール計算を上書きします。0.1から20までの値を受け入れます。object_scale：部屋や障害物アイコンなどのマップオブジェクトの自動計算されたサイズを上書きし、大きくしたり小さくしたりできます。opacity：描画されるマップのグローバルな透明度。初期値は1で、最小値は0です。object_opacity：部屋や障害物アイコンなど、マップ上に描画されるオブジェクトの透明度。初期値は1で、最小値は0です。font_size：有効化されたオブジェクト の上に表示されるテキストバブルのフォントサイズ。0から12までの値を受け入れます。hidden_objects：この特定のマップに対して、グローバルな 高度な設定 で定義された非表示マップオブジェクトを上書きします。
中心揃えとスケーリング
以下のパラメータは、カードが地図を描画する際に自動で計算するサイズおよび中心座標を上書きするために使用されます。
警告
これらのパラメータに提供される値は、地図の生のスケールされていない寸法に対して相対的なものであり、画面上の絶対ピクセルに対するものではありません。これらの相対座標を手動で計算することは非常に複雑なため、必要な正確な値はビジュアルエディタの ライブマップ情報 セクションから抽出できます。
left：地図の自動計算された水平中心を上書きします。例えば、この値を0に設定すると、地図の0座標が X 軸上でカードの水平中心に正確に配置されます。この地点は通常、ドックの真前に位置します。top：地図の自動計算された垂直中心を上書きします。例えば、この値を0に設定すると、地図の0座標が Y 軸上でカードの垂直中心に正確に配置されます。この地点は通常、ドックの真前に位置します。width: フィット計算に使用されるマップの実際の幅を上書きします。カードは最大の適合する寸法に基づいてマップをスケーリングするため、マップの実際の幅より大きい値を入力するとカード内でマップが縮小され、小さい値を入力するとマップが拡大されます。height: フィット計算に使用されるマップの実際の高さを上書きします。widthプロパティと同様に、マップの実際の高さより大きい値を入力するとカード内でマップが縮小され、小さい値を入力するとマップが拡大されます。
YAML の例
yaml
type: custom:dreame-vacuum-card
entity: vacuum.l10s_gen2
map_config:
map_1:
rotation: 90
scale: 1.2
object_scale: 1.5
left: 10
top: -20
hidden_objects:
- name
- virtual_wall
map_2:
rotation: 180
opacity: 0.8背景およびオーバーレイ画像
カードはマップの背後にカスタム背景画像を表示することをサポートしており、これは特に没入型の3Dフロアプランダッシュボードを作成する際に有用です。この動作は background_image プロパティを使用して構成されます。
3D効果をさらに高めるために、オプションのoverlay_imageも提供できます。オーバーレイ画像はロボットの清掃経路の上に直接描画され、その主な目的は、フロアプラン上で物理的な壁や家具の後ろを通る経路を視覚的に隠すことです。背景画像とオーバーレイ画像の両方を組み合わせることは、3Dダッシュボードでリアルな奥行き感を得るために非常に推奨されます。
3Dフロアプランの設計
3Dフロアプラン用のカスタムグラフィックを作成する場合、デザインは透明背景の二つの別々の画像としてエクスポートする必要があります：床や低い家具を含むベースレイヤーと、上部の壁のみを含むトップレイヤーです。
以下の例の画像は、透明部分を強調するためチェッカーボードパターンの上に表示されており、無料のインテリアデザインアプリケーションSweet Home 3Dを使用して生成され、その後、標準の画像編集ソフトウェアで床部分を削除し、必要な透明部分を作成しています。
背景画像
オーバーレイ画像
background_imageとoverlay_imageは、間取り図を揃えるために次のプロパティをサポートします：
url: 画像のパス、例えば/local/first_floor_bg.opacity：画像の透明度。初期値は1で、0までの値を設定可能です。
画像の中央揃えとスケーリング
画像に対するleft、top、widthおよびheightのプロパティは、マップ自身の中心揃えとスケーリング設定とまったく同じ相対座標のロジックで動作します。これらのプロパティは完全に任意です。
カスタム画像がマップのサイズに完全に一致していても、少なくともtopとleftの値を指定することを強く推奨します。これにより、将来マップの全体サイズが変更された場合でも、カスタム画像が同じ相対位置に確実に固定されます。
デフォルト値
これらの値が提供されない場合、カードはカスタム画像のサイズと位置を自動的にマップデータに合わせます。これらのプロパティは完全に任意であり、この動作を上書きして、マップが時間とともに拡大または縮小した場合にカスタム画像が移動したりスケールが変わったりするのを防ぐために存在します。
left: 画像の水平中心をマップの中心に対して定義します。例えば、この値を0に設定すると、マップの0座標が画像の水平中心に正確に配置されます。この点は通常、桟橋のすぐ前に位置しています。top: 画像の垂直中心をマップの中心に対して定義します。例えば、この値を0に設定すると、マップの0座標が画像の垂直中心に正確に配置されます。この点は通常、桟橋のすぐ前に位置しています。width: 画像の幅を、絶対的な画面ピクセルではなく、マップの元のスケールされていない座標系に対して定義します。例えば、この値をマップの生の幅に合わせて設定すると、画像がマップデータとまったく同じ水平範囲を覆うように比例してスケーリングされます。height: 画像の高さを、マップの元のスケールされていない座標系に対して定義します。例えば、この値をマップの生の高さに合わせて設定すると、画像がマップデータとまったく同じ垂直範囲を覆うように比例してスケーリングされます。
ネイティブ回転
カスタム画像には独立した回転プロパティがなく、回転は本質的にマップの回転に結びついています。すべてのビューで整列させるためには、設計された画像の基準向きが、0度に設定したとき、マップの初期向きと完全に一致している必要があります。
デバイスピクセル比 (DPR)
このカードは、デバイスの画面ピクセル比に従って地図をレンダリングします。スマートフォンなどの高解像度ディスプレイで背景やオーバーレイ画像がぼやけて表示されるのを防ぐために、これらの画像はデスクトップダッシュボードで必要なサイズの少なくとも2倍のサイズで提供することが強く推奨されます。
画像サイズの決定
地図データには、1ピクセルが現実世界で何ミリメートルに相当するかを示す grid_size プロパティが含まれています。この値は ライブマップ情報 セクションで確認できます。例えば、grid_size が 50 の場合、各ピクセルは50mm、つまり5cmに相当します。この grid_size で住宅の実際の寸法を割ることで、設定に入力する正確な width と height の値を正確に計算でき、1:1 の間取り図画像が住宅の実際のサイズに完璧に比例して表示されることが保証されます。
YAML の例
yaml
type: custom:dreame-vacuum-card
entity: vacuum.l10s_gen2
map_config:
map_1:
object_scale: 7
width: 250
height: 183
opacity: 0.45
hidden_objects:
- customized_cleaning
- floor
- name
- name_background
- no_go
- no_mop
- order
- walls
background_image:
url: /local/home.png
left: 77
top: 10.3
width: 250
height: 183
opacity: 0.75
overlay_image:
url: /local/home_overlay.png
opacity: 0.9
map_2:
left: 41
top: -12
width: 269
height: 171
background_image:
url: /local/second_floor_bg.png