Geo-labeling using the Geocodemodel interface provided by the Ubuntu SDK

We can use the Geocodemodel in the Ubuntu SDK to GeoCode. For example, we give a place name, through the Geocodemodel to query the location of the specific information, such as longitude dimension, street information and so on. In today's article, we use a simple routine to show how to query a location.

As described in our API documentation:

    Geocodemodel {
        Id:geocodemodel
        plugin:plugin
        autoupdate:false

        onstatuschanged: {
            Mymodel.clear ()
            console.log ("onstatuschanged")
            if (status = = Geocodemodel.ready) {
                var count = Geocodemodel.count
                Console.log ("Count:" + geocodemodel.count) for
                (var i = 0; I < count; i + +) {
                    var location = Geocodemodel.get (i);
                    Mymodel.append ({"Location": Location})}}

        onlocationschanged: {
            Console.log (" Onstatuschanged ")
        }

        component.oncompleted: {
            query =" China Beijing Chaoyang wangjing "
            update ()
        }
    }

In the above code, when our Geocodemodel is loaded, we send a request for a query:

            query = "Beijing Chaoyang wangjing, China"
            Update ()

When this request comes back, return the results we need in our onstatuschanged. We can display the results we need in a list. All of our code is: MAIN.QML

Import QtQuick 2.4 Import ubuntu.components 1.3 Import qtlocation 5.3 Import qtpositioning 5.2 MainView {//Objectna Me for functional testing purposes (AUTOPILOT-QT5) ObjectName: "MainView"//note!

    ApplicationName needs to match the "name" field of the click Manifest ApplicationName: "Geocodemodel.liu-xiao-guo" 
        Width:units.gu (Height:units.gu) Plugin {id:plugin name: "OSM"} listmodel {
        Id:mymodel} positionsource {id:me active:true updateinterval:1000 PreferredPositioningMethods:PositionSource.AllPositioningMethods onpositionchanged: {console.log ("La
            T: "+ Position.coordinate.latitude +" Longitude: "+ position.coordinate.longitude);  Console.log (position.coordinate) console.log ("Mapzoom level:" + map.zoomlevel) Map.coordinate = Position.coordinate} onsourceerrorchAnged: {console.log ("Source error:" + sourceerror); }} geocodemodel {Id:geocodemodel plugin:plugin autoupdate:false Onstatuscha Nged: {mymodel.clear () console.log ("onstatuschanged") if (status = = Geocodemodel.rea
                DY) {var count = Geocodemodel.count Console.log ("Count:" + geocodemodel.count)
                    for (var i = 0; i < count; i + +) {var location = Geocodemodel.get (i);
            Mymodel.append ({"Location": Location})}} onlocationschanged: {
            Console.log ("Onstatuschanged")} component.oncompleted: {query = "Chaoyang wangjing, Beijing, China"
            Update ()}} Page {Id:page header:standardheader pageheader {
Id:standardheader Visible:page.header = = = Standardheader            Title: "Geocoding" trailingactionbar.actions: [Action {iconn
            Ame: "Edit" Text: "edit" OnTriggered:page.header = Editheader}
            ]} pageheader {Id:editheader Visible:page.header = = = Editheader Leadingactionbar.actions: [Action {iconname: "Back" TE
                XT: "Back" ontriggered: {page.header = Standardheader}
                    }] Contents:textfield {id:input Anchors { Left:parent.left Right:parent.right verticalCenter:parent.vertic
                Alcenter} placeholdertext: "Input words ..."
  Text: "Beijing, China Chaoyang wangjing" onaccepted: {                  Geocodemodel.query = text geocodemodel.update ()}}
                } Item {anchors {left:parent.left right:parent.right
                Bottom:parent.bottom Top:page.header.bottom} Column {
                    Anchors.fill:parent ListView {Id:listview clip:true
                    Width:parent.width HEIGHT:PARENT.HEIGHT/3 opacity:0.5 Model:mymodel Delegate:item {id:delegate wi Dth:listview.width height:layout.childrenRect.height + units.gu (0.5) Co

                            lumn {id:layout Width:parent.width
                Text {                Width:parent.width Text:location.address.text
                                WrapMode:Text.WordWrap} Text { Text: "(" + Location.coordinate.longitude + "," + Location.coordinate.latitud E + ")"} Rectangle {Width:pare
                            Nt.width Height:units.gu (0.1) Color: "Green"  }} mousearea {anchors.fill:
                                Parent onclicked: {Console.log ("it is clicked") Map.coordinate = location.coordinate//We don't need the position in
            Fo any more                    Me.active = False}}}
                    } Map {Id:map width:parent.width
                        HEIGHT:PARENT.HEIGHT*2/3 Property var coordinate plugin:plugin {

                    Name: "OSM"} zoomlevel:14 center:coordinate
                        mapcircle {center:map.coordinate Radius:units.gu (3)
                        Color: "Red"} component.oncompleted: {
            Zoomlevel = +}}}} component.oncompleted: {
 Console.log ("Geocodemodel limit:" + Geocodemodel.limit)}}

To run our application:

Source code for the entire project: Https://github.com/liu-xiao-guo/geocodemodel