ThingJSの公式例（11）：データベクトルとテクスチャURLに基づいてODラインを開発する

＃フロントエンド＃＃三次元の視覚化＃＃ ODワイヤーρ展＃

基本的なレイヤーの作成
ODラインの作成（ベクトルとテクスチャ）
大容量のドッキング

はじめに：デジタルツインは、製造分野から都市空間へと徐々に拡大しています。デジタルツイン都市は、工業生産よりもはるかに複雑で、物理的な都市に対応しています。100％現実的ではありませんが、統一された都市情報モデルを構築し、デジタル都市と実際の都市が「現実を組み合わせる」ことを可能にします。3D都市動的モデルには、ポイント、ライン、エリアなどの地理的要素が含まれ、情報デジタルマップに結合されます。これは、都市計画、建設、輸送、エネルギー、その他の分野のデジタルレベルの向上に役立ちます。

デモリンク：http://www.thingjs.com/guide/?m=sample

ODライン（出発地-目的地ライン）は、始点と終点の間の接続を指し、飛行ルート、人口移動、交通の流れ、経済交流など、2点間の特定の関係を示すために使用されます。今週から、中国は春祭りの旅行シーズンのピークにゆっくりと入りました。これは爆発的な人口移動イベントと呼ぶことができます。春祭りの旅行移動マップは通常、OD線を使用して次のことを示します。

出発地では、OD線は移動先として海口市など一方向に収束します。
ここに写真の説明を挿入
目的地から移動すると、OD線はさまざまな方向に広がりますが、出発点は同じ場所です。たとえば、人口がハービンから移動します。

GeoLineは、地理的な場所を持つ線要素です。属性フィールドを追加して他の情報を格納できます。3つの異なる線種に分割できます。OD線の違いは、GISで形成できる開始点と終了点を制限することです。3次元のOD線を描画するには注意事項は何ですか？ODラインと他のラインの作成の違いは何ですか？

ODライン開発の経験についてはデモを参照してください。http://www.thingjs.com/guide/?m=sample

1.基本的なレイヤーの作成

アースコンポーネントが動的にロードされた後、さまざまなレイヤーオーバーレイが取得され、ThingLayerサービスレイヤーでより柔軟な2次開発が実行されます。ThingLayerレイヤーを作成し、ThingLayerを下の画像に追加して、開始点の座標位置startPosを取得し、点とサーフェスからの外向き拡散の効果を示します。
var startPos = [116.39139175415039、39.906082185995366];

2.ODラインの作成

ThingJSレンダラーには、ベクターレンダリングとイメージレンダリングの2つのレンダリングタイプがあります。ODラインを取得するには、まず北京-金南などのThingJSレイヤーから移行パスを照会してから、このパスのスタイルを変更します。
ここに写真の説明を挿入

（1）ベクタースタイルのレンダリング

レンダラーは、ベクトルベクトル線の色を設定します。この例は、rgb配列[255,0,0]の使用方法を示しています。rgb文字列 "rgb（255,0,0）"、16進文字列 "＃を使用することもできます。 ff0000 "。
フロー効果の速度はデフォルトで0であり、これは静的効果です。値は正または負で、正と負の両方の流れ方向を表します。テクスチャスタイルも適用できます。

renderer: {
    lineType: 'Line',
    type: 'vector', // 代表纯色渲染
    color: [255, 0, 0],
    // opacity:0.2 ,// 设置不透明度 默认是1
    // speed: 1 ,// 流动效果速度， 默认是0 不流动；speed 可正可负，正负代表流动方向
    // effect: true // 线发光效果 默认为 false 不开启
}
});

（2）画像スタイルのレンダリング

urlを取得して、テクスチャタイプのODラインを生成します。色やその他のスタイルはテクスチャ自体が所有します。テクスチャチャネルnumPassのオーバーレイ数を変更することで、線幅を拡張できます。一般的に、値が大きいほど、ラインは明るくなります。
エフェクト機能を使用して、マップで重要な役割を果たすラインライティング特殊エフェクトをオンにします。

renderer: {
    lineType: 'Line',
    type: 'image', // 代表贴图渲染
    imageUrl: '/guide/image/uGeo/path.png',
    numPass: 3,
    speed: 0.5, // 流动效果速度， 默认是0 不流动；speed 可正可负，正负代表流动方向
    // effect: true // 线发光效果 默认为 false 不开启
}

3.大量のデータのドッキング

データ量の多いOD回線では、通常、ブラウザ側で少なくとも数十万または100万を超えるレンダリングが必要です。データ送信やデータレンダリングに関係なく、より効率的な方法が必要です。ThingJSプラットフォームは動的なビッグデータ生成を提供します。 WebSocket（数百万）、MQTT（単一マシン数千万）データインターフェイスを使用したインターフェイス。スムーズな二重通信、およびフロントエンドSDKを使用した簡単なオンライン開発を実現します。

ThingJSについて

ThingJSは、Internet of Thingsの3D視覚化コンポーネントを提供して、3D開発を容易にします。200の3D開発ソースコード例に基づく直接Javascript呼び出し3Dスクリプトを使用すると、Internet ofThingsのビジュアル開発ロジックを完全に理解できます。シナリオ構築-3Dスクリプト開発-データドッキング-プロジェクト展開を使用するワンストップサービスは、開発をより効率的にし、20万人の開発者を擁するデジタルツインテクノロジーイノベーターになります！
ここに写真の説明を挿入