How to use Baidu map to display a coordinate location in Ubuntu phone

Maps play a very important role in our lives. We can use the location service provided in the Ubuntu phone to get location information and show your location on the Baidu map. When we show the location information, we have to remember that we have to do the necessary coordinate transformation, otherwise we display the map information is not accurate. For more information, you can access the coordinate Transformation API Web service API.

Let's use a routine to show how to do coordinate transformations and display the correct map information.

MAIN.QML

Import QtQuick 2.4 Import ubuntu.components 1.3 import "Webapi.js" as API import qtpositioning 5.0 MainView {Id:ma Inscreen//ObjectName for functional testing purposes (AUTOPILOT-QT5) ObjectName: "MainView"//note! ApplicationName needs to match the "name" field of the click Manifest ApplicationName: "Baidumap.liu-xiao-guo" PR Operty string Longitude: "116.3883" property string Latitude: "39.9289" Width:units.gu () Height:units.gu ( Positionsource {id:me active:true updateinterval:1000 Preferredpositioningmet Hods:PositionSource.AllPositioningMethods onpositionchanged: {console.log ("Latitude:" + position.co
            Ordinate.latitude + "Longitude:" + position.coordinate.longitude);
            Console.log (position.coordinate) mainscreen.longitude = Position.coordinate.longitude;

   Mainscreen.latitude = Position.coordinate.latitude;         Before.source = Api.getstaticmap (longitude, latitude)//Do the conversion here Api.conv Ertcoordinates (longitude, Latitude, gotconverted)} onsourceerrorchanged: {console.log ("sour
        CE error: "+ sourceerror); }} function gotconverted (o) {after.source = Api.getstaticmap (O.longitude, O.latitude)} Page

            {title:i18n.tr ("Baidumap") Column {anchors.fill:parent Spacing:units.gu (2)                 

                Image {Id:before Width:parent.width HEIGHT:PARENT.HEIGHT/2 Label {text: "Before conversion" FontSize: "Lar
                GE "}} Image {Id:after width:parent.width
   HEIGHT:PARENT.HEIGHT/2 Label {text: "After conversion"                 FontSize: "Large"}}}} 

In the above code, we use:

    Positionsource {
        id:me
        active:true
        updateinterval:1000
        preferredpositioningmethods: Positionsource.allpositioningmethods
        onpositionchanged: {
            console.log ("Latitude:" + Position.coordinate.latitude + "Longitude:" +
                        position.coordinate.longitude);
            Console.log (position.coordinate)

            mainscreen.longitude = position.coordinate.longitude;
            Mainscreen.latitude = Position.coordinate.latitude;

            Before.source = Api.getstaticmap (longitude, latitude)

            //Do the conversion here
            Api.convertcoordinates ( Longitude, latitude, gotconverted)
        }

        onsourceerrorchanged: {
            console.log ("Source Error:" + sourceerror);
        }
    }

To get our current location information: longitude, dimension. We can display the map information through the Staticmap API interface of Baidu.
In the above code, we show two images, one with no converted images, the other a map image after the coordinate conversion. After the comparison, we will find that the transformed map information is closer to our actual location. To run our project:


Not afraid everyone knows, it is the address of my home. Very precise. The source code of the whole project is: Https://github.com/liu-xiao-guo/baidumap