Back to Qt.io
Contact Us Blog Download Qt
이 페이지에서

장소 지도 (QML)

'장소 지도' 예제는 MapItemView 를 사용하여 지도에서 장소를 검색하고 목록을 표시하는 방법을 보여줍니다.

피자 가게 위치를 표시한 여러 개의 표지판이 있는 지도

이 예제는 현재 위치의 지도를 표시하며, 위치를 확인할 수 없는 경우에는 노르웨이 오슬로를 기준으로 합니다. 그 후 "food"라는 검색어와 일치하는 장소를 검색하여 각 결과를 지도에 표시합니다.

예제 실행

다음에서 예제를 실행할 수 있습니다:

지도에 장소를 표시할 QML 애플리케이션을 작성하려면, 먼저 다음과 같은 임포트 선언을 추가합니다.

import QtQuick
import QtPositioning
import QtLocation

Plugin 인스턴스를 생성합니다. Plugin 는 사실상 장소 데이터를 가져오는 백엔드 역할을 합니다. 선택한 플러그인에 따라 필수 매개변수가 필요할 수 있습니다. 이 예제에서는 필수 매개변수가 없는 OSM 플러그인을 선택했습니다.

Plugin {
    id: myPlugin
    name: "osm"
    //specify plugin parameters if necessary
    //PluginParameter {...}
    //PluginParameter {...}
    //...
}

다음으로, 검색 매개변수를 지정하고 장소 검색 작업을 수행하는 데 사용할 수 있는 ` PlaceSearchModel ` 인스턴스를 생성합니다. 설명을 위해 모델 생성이 완료되면 ` update()`를 한 번 호출합니다. 일반적으로 ` update()`는 버튼 클릭과 같은 사용자 동작에 반응하여 호출됩니다.

PlaceSearchModel {
    id: searchModel

    plugin: myPlugin

    searchTerm: "food"
    searchArea:  QtPositioning.circle(positionSource.lastSearchPosition, 1000 /* 1 km radius */)
    Component.onCompleted: update()
}

지도는 MapView 타입을 사용하여 표시되며, 내부에서는 MapItemView 를 선언하고 검색 모델과 델리게이트를 전달합니다. 인라인 델리게이트가 사용되었으며, 모든 검색 결과가 type PlaceSerachesult 유형이라고 가정했습니다. 따라서 항상 장소( role)에 접근할 수 있다고 가정하지만, 다른 검색 결과 유형에는 장소 ( role)가 없을 수도 있습니다.

MapView {
    id: view
    anchors.fill: parent
    map.plugin: myPlugin;
    map.center: positionSource.lastSearchPosition
    map.zoomLevel: 13

    MapItemView {
        model: searchModel
        parent: view.map
        delegate: MapQuickItem {
            coordinate: place.location.coordinate

            anchorPoint.x: image.width * 0.5
            anchorPoint.y: image.height

            sourceItem: Column {
                Image { id: image; source: "marker.png" }
                Text { text: title; font.bold: true }
            }
        }
    }
}

마지막으로, PositionSource 을 사용하여 지도를 현재 위치로 재설정하고 새로운 지역 내의 “음식” 장소를 찾습니다. 위치 정보는 2분마다 업데이트되며, 새로운 위치가 마지막 음식 검색 지역에서 500미터 이상 떨어져 있을 경우 장소 검색이 다시 실행됩니다.

PositionSource {
    id: positionSource
    property variant lastSearchPosition: QtPositioning.coordinate(59.93, 10.76) //Initialized/Fallback to Oslo
    active: true
    updateInterval: 120000 // 2 mins
    onPositionChanged:  {
        var distance = lastSearchPosition.distanceTo(position.coordinate)
        if (distance > 500) {
            // 500m from last performed food search
            lastSearchPosition = positionSource.position.coordinate
        }
    }
}

예제 프로젝트 @ code.qt.io

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.