ifame.html 5.1 KB
<!--<iframe src="https://www.thingjs.com/pp/eb1ef62559ddf908beadaddd" height="100%" width="100%"></iframe>-->
<script>
    let city_points = [
        {
            "name": "CGO",
            "point": [113.84857177734375, 34.52692430140103]
        },
        {
            name: "ICN",
            point: [126.44439697265624,37.45741810262938]
        },
        {
            name: "CGN",
            point: [7.126007080078125,50.875311142200765]
        },
        {
            name: "ANC",
            point: [210.00915527343747,61.16841084497744]
        },
        {
            name: "ZAZ",
            point: [-1.0074806213378906, 41.664448551062456]
        },
        {
            name: "HKG",
            point: [113.91448974609375,22.314507734511825]
        },
        {
            name: "LUX",
            point: [6.217231750488281,49.63517499335973]
        },
        {
            name: "LGG",
            point: [5.443210601806641,50.63901028125873]
        },
        {
            name: "TBS",
            point: [44.962921142578125,41.66778269875833]
        }
    ];

    city_points.forEach(function (obj) {
        var airport = obj["name"];
        var airport_point = obj["point"];

        //渲染航线
        let airgeoODLine = app.create({
            type: 'GeoFlyLine',
            name: airport,
            coordinates: [
                airport_point,
                startPos
            ],
            renderer: {
                type: 'image', // 代表贴图渲染
                lineType: 'Plane',
                imageUrl: '/guide/image/uGeo/path.png',
                width: 5, // 设置线宽 单位像素
                numPass: 5,
                speed: line_spped, // 流动效果速度, 默认是0 不流动;speed 可正可负,正负代表流动方向
                effect: true // 线发光效果 默认为 false 不开启
            }
        });

        //渲染机场坐标
        let geoPoint = app.create({
            type: 'GeoPoint',
            name: airport,
            coordinates: airport_point,
            offsetHeight: 2,    //离地高度 单位:米
            userData: { 'cityName': '郑州' },
            pivot:[0.5,1], //指定轴心点位置为图片x方向中点y方向最下
            label: {
                text: '{{cityName}}', //使用cityName字段的值进行标注
                offset: [0, 30],
                fontColor: [255, 0, 0],
                fontSize: 20
            },
            infoWindow:
                {
                    'title': '标题',
                    'displayMode': 'clickShow', //点击弹出
                    'type': 'standard',         //标准模式
                    'style': 'default',         //默认样式
                    'fieldData': [
                        {
                            'field': 'cityName',
                            'alias': '名称'
                        }]
                },
            renderer: {
                type: "image", //type有'image','model','vector'三种
                //url: 'image/uGeo/pop.png',//针对image和model 代表资源的路径
                url: 'https://www.thingjs.com/citybuilder_console/upload/mapIcons/systemIcons/27.png',
                size: 2,// 对于image,vector 是一个数字 代表缩放倍数 对于model 是一个数组 代表xyz轴向的缩放比例
            }
        });

    });

THING.Utils.dynamicLoad(['https://gallerybox.echartsjs.com/dep/echarts/latest/echarts.min.js'], function () {
            var app = new THING.App({
                url: 'https://www.thingjs.com/static/models/storehouse'// 场景地址
     });
            // 创建图表
     createChart();
     function createChart(echartOptions) {
         var bottomBackground = document.createElement('div');
     }
     //创建背景块
     var bottomDom = document.createElement('div');
     //创建图表块
    // 设置两个块的样式
    var backgroundStyle = 'bottom:0px; position: absolute;right:0px;height:400px;width:600px;background: rgba(41,57,75,0.74);';
    var chartsStyle = 'position: absolute;top:80px;right:0px;width:600px;height:300px;';
    // 设置样式
    bottomBackground.setAttribute('style', backgroundStyle);
    bottomDom.setAttribute('style', chartsStyle);
    // echarts 初始化
     var bottomCharts = window.echarts.init(bottomDom);
     //数据部分
    bottomCharts.setOption(echartOptions);
    bottomBackground.appendChild(bottomDom);
    app.domElement.appendChild(bottomBackground);
    var bottomCharts = window.echarts.init(bottomDom);// echarts 初始化
     bottomCharts.setOption(option);
     bottomCharts.on('click', function (params) {
         cancelOutline();
         reset();
         clearUiAnchorArr();
         if(params.name == "空置车位"){
             for(var i = 0; i < app.query("空置车位").length; i++){
                 app.query("空置车位")[i].style.outlineColor = "#00ff00"
             }
         }else if(params.name == "占用车位"){
             for(var i = 0; i < app.query("占用车位").length; i++){
                 app.query("占用车位")[i].style.outlineColor = "#ff0000"
             }
         }
     })
}});

</script>