Application case of Web 3D configuration simulation: data monitoring of civil aircraft

Time:2020-9-17

preface

In the process of aircraft navigation, the screen above the seats in the cabin will switch to a monitoring system of aircraft navigation from time to time in addition to TV dramas and advertisements. The main purpose of this monitoring system is to let passengers know the overall situation of the aircraft during the flight, the route progress from the destination and some possible emergencies. To a certain extent, the monitoring system of aircraft navigation can make passengers get accurate information source during the journey, and the most important thing is to make passengers feel at ease during the journey. At the same time, the aircraft navigation monitoring system can also timely feed back the collected data to the flight personnel, and save the data records, which can be used, monitored and maintained by the aviation and maintenance personnel during or after the flight. Between 2D configuration and 3D configuration,Hightopo(hereinafter referred to as HT)HT for WebThere are rich configuration options on the product, this article will introduce how to use the HT rich2 / 3D configurationBuild a solution of aircraft navigation monitoring system.

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

Preview address: flight monitor

systems analysis

Aircraft navigation monitoring is a simple and practical method to measure and track the changing trend of aircraft performance. In daily flight, the parameters of aircraft cruise are recorded by airborne instruments and compared with the original performance. The main parameters of monitoring are: fuel consumption per unit time of flight, cruise flight speed of aircraft and horizontal distance of aircraft flying over unit fuel consumption. They represent the comprehensive performance of engine, aircraft and aircraft engine respectively. They represent the comprehensive performance of engine, aircraft and aircraft engine respectively. The results of performance monitoring can not only provide possible fault information for aircraft maintenance, but also provide reliable performance basis for making flight plan.

At present, advanced jet transport aircraft have been equipped with flight status monitoring system, which records the relevant parameter values, And stored in the data management device, these data can be sent to the ground station or sent to the ground station after the aircraft landing. The special computer program is used for calculation and correction, which makes the collection, transmission, calculation and analysis of performance monitoring data automatic, saving manpower and improving accuracy.

1. Flight data recorderSince the birth of flight data recorder (FDR) “commonly known as black box”, the detailed and accurate flight data provided by FDR has provided important basis for accident investigation, maintenance support and safety operation monitoring, and has become an important management method for aviation safety operation.

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

2. Overview of ACMS (aircraft condition monitoring system)ACMS system is an advanced airborne data acquisition and processing system installed on the aircraft. It can collect data in real time, monitor engine status and flight performance, and carry out special engineering investigation. It is sent to the ground receiving station by the aircraft communication addressing and reporting system (ACARS) through the ground to air data link, and finally transmitted to the terminal of the airline company. The data record can also be saved by QAR, which can be used by the aviation and maintenance personnel during or after the flight.

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

The business functions of HT can be displayed through the data collected by ACMS system and displayed in the display terminal. The real-time monitoring data can be displayed accurately, which can monitor the status of the aircraft and feed back the changes of information and data immediately.

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

Implementation process

Travel through the clouds

In order to achieve the effect of flying through the clouds, the first problem I encountered was the sense of hierarchy of aircraft flight, which is commonly called perspective effect. Here, I use cloud channel and cloud background to flow at different speeds to create a perspective effect of flight.

I use the way of texture to render the cloud, but only the texture will block the sky and the plane, which greatly affects the view of aircraft flying, so I opened the corresponding primitivetransparentandopacityThe transparency of cloud background and cloud channel is different, which not only increases the sense of hierarchy, but also gives people the illusion that clouds drift past in front of their eyes.

Cloud channel usesht.PolylineType, channel scaling enlarges the scale of the Y axis, so that the cloud channel has more vertical spacereverse.flipThe back copy makes the inner part of the cloud channel also show the texture, as if the airplane is in the sea of cloudsht.NodeType to set only one face display as the cloud background.

The overall cloud flow effect adoptsoffsetOffset implementation: change the mapping offset of the corresponding primitive or corresponding primitive face to achieve the effect of flying through the cloud. The code is as follows:

var i = 1,
    p = 0;
setInterval(() => {
    i -= 0.1; p += 0.005;
    clouds.s('shape3d.uv.offset', [i, 0]);
    cloudBackground.s('all.uv.offset', [p, 0]);
}, 100);

Bump effect

Although it can achieve the effect of flying through the clouds, if the plane only flies straight, it will reduce the real feeling of flight. I believe that all friends who have been on the plane must have encountered turbulence caused by the airflow, and often feel the climbing and falling of the aircraft in flight. This is because the route of the aircraft is not always fixed at a height, sometimes it will climb and sometimes it will Drop, so I use itht-animation.jsHT animation extension plug-in to achieve the effect of aircraft turbulence, the code is as follows:

dm.enableAnimation(20);
plane.setAnimation({
    back1: {
        from: 0,
        to: 160,
        easing: 'Cubic.easeInOut',
        duration: 8000,
        next: "up1",
        onUpdate: function (value) {
            value = parseInt(value);
            var p3 = this.p3();
            this.p3(value, p3[1], p3[2]);
        }
    },
    //... omit similar
    start: ["back1"]
});

Sphere sector angle limit

After the flight effect was improved, I encountered a more difficult problem. In fact, although the plane was shuttling through the sea of clouds, it was only flying in the channel, and the background was actually just a plane map. Therefore, when the angle of view reached a certain degree, there would be a strong sense of violation and unreal. Therefore, a perspective restriction was needed to adjust the angle of view Fortunately, within a certain range.

If the angle of view is limited, it is generally limited to g3deyeandcenterFor those who don’t know much about it, you can go to the 3D manual on the official website of hightopo, which has detailed instructions, so I won’t repeat it here. Because of the scope of the perspective, I decided to fix itcenterThe location code is as follows:

g3d.addPropertyChangeListener(e => {
    //Fixed center point
    if (e.property === 'center') {
        e.newValue[0] = center[0];
        e.newValue[1] = center[1];
        e.newValue[2] = center[2];
    }
}

And then put theeyeLimited to a certain range, it’s finished. However, it’s not so simple here. At the beginning, I put iteyeIt is limited in the space of a cube, but the interaction effect is not ideal. Considering the default interaction of g3d, when dragging the mouse to shift the perspective, in facteyeIt’s in acenterIt’s moving on the sphere of the center of the ball, so I decided to dig a piece out of this balleyeFor those who don’t quite understand it, you can refer to this figure

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

Three parameters are needed to limit the viewing angle of the ball sector, which are the angle between the central axis and the outer edge, and the limiting radius of the balleyeandcenterThe limit radius of the ball is divided into the maximum limit and the minimum limit. The code is as follows:

function limitEye(g3d, eye, center, options) {
    var limitMaxL   = options.limitMaxL,
        limitMinL   = options.limitMinL,
        limitA      = options.limitA;

    g3d.addPropertyChangeListener(e => {
        //Fixed center point
        if (e.property === 'center') {
            e.newValue[0] = center[0];
            e.newValue[1] = center[1];
            e.newValue[2] = center[2];
        }
        //Restricted Perspective
        if (e.property === 'eye') {
            var newEyeV = new ht.Math.Vector3(e.newValue),
                centerV = new ht.Math.Vector3(center),
                refEyeV = new ht.Math.Vector3(eye),
                refVector = refEyeV.clone().sub(centerV),
                newVector = newEyeV.clone().sub(centerV);

            if (centerV.distanceTo(newEyeV) > limitMaxL) {
                newVector.setLength(limitMaxL);
                e.newValue[0] = newVector.x;
                e.newValue[1] = newVector.y;
                e.newValue[2] = newVector.z;
            }
            if (centerV.distanceTo(newEyeV) < limitMinL) {
                newVector.setLength(limitMinL);
                e.newValue[0] = newVector.x;
                e.newValue[1] = newVector.y;
                e.newValue[2] = newVector.z;
            }
            if (newVector.angleTo(refVector) > limitA) {
                var oldLength = newVector.length(),
                    oldAngle  = newVector.angleTo(refVector),
                    refLength = oldLength * Math.cos(oldAngle),
                    vertVector,
                    realVector,
                    realEye;

                refVector.setLength(refLength);

                newEyeV = newVector.clone().add(centerV);
                refEyeV = refVector.clone().add(centerV);
                vertVector = newEyeV.clone().sub(refEyeV);
                vertLength = refLength * Math.tan(limitA);

                vertVector.setLength(vertLength);

                realVector = vertVector.clone().add(refEyeV).sub(centerV);

                realVector.setLength(oldLength);

                realEye = realVector.clone().add(centerV);

                //Prevent the angle of movement greater than 180 degrees and reverse the angle of view
                if (oldAngle > Math.PI / 2) {
                    realEye.negate();
                }

                e.newValue[0] = realEye.x;
                e.newValue[1] = realEye.y;
                e.newValue[2] = realEye.z;
            }  
        }
    })
}

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

Aircraft monitoring system

Of course, as a monitoring system, it is necessary to have monitoring. A small map in the lower right corner is added, and three modes are provided: focusing the aircraft, focusing the flight trajectory and focusing the map. The flow effect of the flight path is controlled according to the flight direction of the aircraft, in which the focused aircraft will follow the movement of the aircraftfitDataTo keep the aircraft in the center of the map, the code is as follows:

var fitFlowP = function (e) {
    if (e.property === 'position' && e.data === plane) {
        mapGV.fitData(plane, false);
    }
};
buttonP.s({
    'interactive': true,
    'onClick': function (event, data, view, point, width, height) {
        map.a('fitDataTag', 'plane2D');
        mapGV.fitData(plane, false);
        mapDM.md(fitFlowP);
    }
});
buttonL.s({
    'interactive': true,
    'onClick': function (event, data, view, point, width, height) {
        mapDM.umd(fitFlowP);
        map.a('fitDataTag', 'flyLine');
        mapGV.fitData(flyLine, false);
    }
});
//... omitted

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

Add the mouse to the corresponding position of the aircraft to prompt the name, double-click to display the information panel of the corresponding position of the aircraft and focus the perspective on the panel, and click anywhere on the aircraft to switch back to the aircraft flight mode.

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

A monitoring panel is added on the left side instead of double clicking the corresponding position mentioned above. This step directly focuses on the information panel of the corresponding position. Here, the button opens the interaction and adds the corresponding interaction logic. The code is as follows:

button_JC.s({
    'interactive': true,
    'onClick': function (event, data, view, point, width, height) {
        event.preventDefault();
        let g3d = G.g3d,
            g3dDM = G.g3d.dm();
        g3d.fireInteractorEvent({
            kind: 'doubleClickData',
            data: g3dDM.getDataByTag(data.getTag())
        })
    }
});
//... omitted

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

Sky rendering effect

Since the monitoring system must be 24-hour monitoring without any difference, this involves a problem. I can’t fly through the sky of tile blue and tile blue in the middle of the night, which is very lack of authenticity. Therefore, there should be a process of the sky from light to dark, and then from dark to bright. This process is tentatively scheduled for 06:00-06:30 and 19:00-19:30.

The sky usesshape3d : ‘sphere’Sphere, wrap the whole scene, and then usereverse.flipBack copy andblendAfter coloring, the sky can be rendered to the color I want. If you change the sky brightness according to the time, just change the color value.

However, due to the different lighting conditions in the daytime and at night, the intensity of the reflected light from the clouds is also different, which leads to the difference between the daytime and the night clouds. Therefore, it is necessary to adjust the mapping of the cloud channel and cloud backgroundopacityTransparency, more transparency at night, code as follows:

if ((hour > 6 && hour < 19) || (hour == 6 && minutes >= 30)) {
    timePane && timePane.a({
        'morning.visible': false,
        'day.visible': true,
        'dusk.visible': false,
        'night.visible': false,
        'day.opacity': 1
    })
    skyBox.s({
        "shape3d.blend": 'rgb(127, 200, 240)',
    })
    cloudBackground.s({
        "back.opacity": 0.7,
    })
    clouds.s({
        "shape3d.opacity": 0.7,
    })
} else if ((hour < 6 || hour > 19) || (hour == 19 && minutes >= 30)) {
//... omitted
} else if (hour == 6 && minutes < 15 ) {
//... omitted
} else if (hour == 6 && minutes >= 15 && minutes < 30) {
//... omitted
} else if (hour == 19 && minutes < 15) {
//... omitted
} else if (hour == 19 && minutes >= 15 && minutes < 30) {
//... omitted
}

 Application case of Web 3D configuration simulation: data monitoring of civil aircraft

Here, I also add the support for the time status icon in the upper right corner, and add the fade out effect when the icon is switched. At the same time, the function of clicking to switch to the next time state is added to the position of the time panel status icon.

In order to demonstrate the effect, I added the time double speed button. The following figure shows the change under 500 times time flow rate:

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

summary

In the era of big data, with the rapid development of network technology, we have ushered in the new journey of 5g and the new transformation of industry 4.0. Under the integration of information data acquisition and transmission and data visualization system, we can explore many solutions of industry control visualization system. HT has been committed to the construction of system visualization in various industries for a long time. Through the accumulated experience of the technology industry involved, and through the independent innovation and development of technical products, HT has built many representative visual control systems in the industry, such as the UAV 3D visualization system, which is also related to aircraft monitoring

Application case of Web 3D configuration simulation: data monitoring of civil aircraft

In 2019, we have also updated hundreds of 2D / 3D visualization case sets of industrial Internet, where you can find many novel examples and discover different industrial Internet: https://mp.weixin.qq.com/s/ZbhB6LO2kBRPrRIfHlKGQA

At the same time, you can also view more cases and effects: https://www.hightopo.com/demos/index.html

Recommended Today

Review of SQL Sever basic command

catalogue preface Installation of virtual machine Commands and operations Basic command syntax Case sensitive SQL keyword and function name Column and Index Names alias Too long to see? Space Database connection Connection of SSMS Connection of command line Database operation establish delete constraint integrity constraint Common constraints NOT NULL UNIQUE PRIMARY KEY FOREIGN KEY DEFAULT […]