Elenco e anteprima delle sparse spatial map

EasyAR Spatial Map solitamente archivia grandi quantità di dati di mappe spaziali. Questo capitolo descrive in dettaglio come ottenere i dettagli della spatial map e come recuperare l'elenco paginato delle sparse spatial map.

Gestire sparse spatial map tramite EasyAR Web

Nell'interfaccia visiva, il sistema visualizza le sparse spatial map in forma di elenco paginato e le ordina in ordine inverso per data di ultima modifica (le più recenti appaiono per prime).

Elenco sparse spatial map

Percorso operativo: accedi a EasyAR Web [Development center] -> [SpatialMap] -> seleziona la gallery -> clicca [Manage].

In questa interfaccia puoi effettuare queste operazioni:

Navigazione elenco: visualizza la raccolta di spatial map paginate.
Accesso ai dettagli: clicca sul pulsante 1 [Manage] per accedere alla pagina dei dettagli della mappa.
Ricerca precisa: nella casella di input 2, sono supportati questi tipi di ricerca:
- Ricerca per nome: se il tuo sistema nomina le immagini secondo regole (es. ID interno all'app), puoi localizzarle rapidamente per nome.
- Ricerca per MapId
- Ricerca per Label, GPS: supportata solo dall'API Search

Informazioni dettagliate della spatial map

Dopo aver cliccato per accedere alla pagina dei dettagli, puoi visualizzare tutte le proprietà della spatial map, tra cui:

Preview: immagine di anteprima.
Name: nome della spatial map.
MapId: ID univoco generato dal sistema.
status: attiva o disattivata.
Label: etichette personalizzate per facilitare la ricerca, supportate dall'API Search
GPS: coordinate GPS della mappa, sistema di coordinate personalizzato, supportate dall'API Search
Meta personalizzato: metadati associati a questa spatial map (es. URL del modello)

detail

Utilizzare l'API per visualizzare l'elenco delle spatial map

Per gli sviluppatori che necessitano di integrare nel proprio backend, si consiglia di utilizzare le REST API per la gestione.

Documentazione di riferimento: API per l'elenco delle spatial map

Preparazione

Prima di effettuare la richiesta, assicurati di avere queste risorse (dettagli nella lista di preparazione per le API):

SpatialMap AppId
API Key / Secret o Token
Cloud URL
- Utenti in Cina e Sud-est asiatico: https://armap-api.easyar.com
- Altri utenti: https://armap-api-na1.easyar.com

Per favore sostituisci i segnaposto con i parametri effettivi e esegui lo script curl

Your-URL → effettivo cloud url
Your-Token → effettivo api key authorization token
Your-SpatialMap-AppId → effettivo spatialmap appid

curl -X GET "https://armap-api-<cn1|na1>.easyar.com/maps?appId=<Your-SpatialMap-AppId>" \
  -H "Content-Type: application/json" \
  -H "Authorization: <Your-Token>"

Scarica il codice di esempio Java

Java Samples Download

Importa il progetto tramite Maven

Step 1. Apri l'esempio di codice ListMaps.java

Step 2. Modifica le variabili globali, sostituendo i parametri di autenticazione dalla tua lista di preparazione

SpatialMap AppId
API Key / API Secret
Cloud URL

ListMaps.java

import okhttp3.OkHttpClient;
import okhttp3.Response;
import org.json.JSONObject;
import java.io.IOException;
import java.util.Set;

public class ListMaps {

    private static final String CLOUD_URL       = "https://armap-api.easyar.com";
    private static final String APPID           = "--here is your SpatialMap AppId--";
    private static final String API_KEY         = "--here is your API Key--";
    private static final String API_SECRET      = "--here is your API Secret--";

    public String  toParam(JSONObject jso) {
        Set<String> keys = jso.keySet();
        StringBuffer sb   = new StringBuffer();
        for (String key : keys){
            sb.append(key);
            sb.append("=");
            sb.append(jso.getString(key));
            sb.append("&");
        }
        return sb.substring(0,sb.length()-1);
    }

    public String list(Auth auth) throws IOException {
        OkHttpClient client = new OkHttpClient.Builder().build();
        JSONObject params = new JSONObject();
        Auth.signParam(params, auth.getAppId(), auth.getApiKey(), auth.getApiSecret());
        okhttp3.Request request = new okhttp3.Request.Builder()
                .url(auth.getCloudURL() + "/maps?"+ toParam(params))
                .get()
                .build();
        Response response = client.newCall(request).execute();
        return response.body().string();
    }
    public static void main(String[] args) throws IOException{
        Auth accessInfo  =  new Auth(APPID, API_KEY, API_SECRET, CLOUD_URL);
        System.out.println(new ListMaps().list(accessInfo));
    }

}

Step 3. Esegui Main

Passo 1. Copia il codice di esempio in listmap.js, modifica il Token, appId e Cloud URL

Passo 2. Esegui

npm install axios
node listmap.js

Se devi modificare la strategia di paginazione, passa i parametri di paginazione

pageSize: dimensione della pagina
pageNum: numero della pagina

const axios = require('axios');

class MapService {
    constructor(baseURL, token, appId) {
        this.baseURL = baseURL;
        this.token = token;
        this.appId = appId;
        this.client = axios.create({
            baseURL: baseURL,
            headers: {
                'Authorization': token,  
                'Content-Type': 'application/json'
            }
        });
    }

    async listMaps(params = {}) {
        try {
            const queryParams = {
                ...params,
                appId: this.appId 
            };

            const response = await this.client.get('/maps', { params: queryParams });
            
            console.log('=== API Response ===');
            console.log('Status Code:', response.status);
            console.log('Request URL:', response.config.url);
            console.log('Request Headers:', JSON.stringify(response.config.headers, null, 2));
            console.log('Request Params:', JSON.stringify(queryParams, null, 2));
            console.log('Response Data:', JSON.stringify(response.data, null, 2));
            console.log('Timestamp:', new Date().toISOString());
            
            return response.data;
        } catch (error) {
            console.error('=== API Error ===');
            if (error.response) {
                console.log('Status Code:', error.response.status);
                console.log('Error Data:', error.response.data);
            } else {
                console.log('Error Message:', error.message);
            }
            throw error;
        }
    }
}

async function main() {
    const config = {
        baseURL: 'https://armap-api-<cn1|na1>.easyar.com',
        token: 'your_token_here', 
        appId: 'your_app_id_here' 
    };

    const mapService = new MapService(config.baseURL, config.token, config.appId);
    
    const queryParams = {
        pageNum: 1,
        pageSize: 10
    };

    try {
        const result = await mapService.listMaps(queryParams);
        console.log('\n=== Success ===');
    } catch (error) {
        console.log('\n=== Failed ===');
    }
}

if (require.main === module) {
    main();
}

module.exports = MapService;

Passo 1. Copia il codice di esempio in listmap.php, modifica Token, appId e URL Cloud

Passo 2. Esegui

php listmap.php

Per modificare la strategia di paginazione, passa i parametri di paginazione

'pageSize': dimensione della pagina
'pageNum': numero di pagina

<?php
class MapService {
    private $baseURL;
    private $token;
    private $appId;
    
    public function __construct($baseURL, $token, $appId) {
        $this->baseURL = $baseURL;
        $this->token = $token;
        $this->appId = $appId;
    }
    
    public function listMaps($params = []) {
        $queryParams = array_merge([
            'appId' => $this->appId
        ], $params);
        
        $queryString = http_build_query($queryParams);
        $url = $this->baseURL . '/maps?' . $queryString;
        
        $ch = curl_init();
        
        curl_setopt_array($ch, [
            CURLOPT_URL => $url,
            CURLOPT_RETURNTRANSFER => true,
            CURLOPT_HTTPHEADER => [
                'Authorization: ' . $this->token, 
                'Content-Type: application/json'
            ],
            CURLOPT_SSL_VERIFYPEER => false,
            CURLOPT_TIMEOUT => 30
        ]);
        
        $response = curl_exec($ch);
        $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE);
        $error = curl_error($ch);
        
        echo "=== API Request ===" . PHP_EOL;
        echo "URL: " . $url . PHP_EOL;
        echo "Headers: Authorization: " . $this->token . PHP_EOL;
        echo "Query Params: " . json_encode($queryParams, JSON_PRETTY_PRINT) . PHP_EOL;
        
        curl_close($ch);
        
        echo "=== API Response ===" . PHP_EOL;
        echo "Status Code: " . $httpCode . PHP_EOL;
        echo "Timestamp: " . date('c') . PHP_EOL;
        
        if ($error) {
            echo "cURL Error: " . $error . PHP_EOL;
            return null;
        }
        
        $responseData = json_decode($response, true);
        echo "Response Data: " . json_encode($responseData, JSON_PRETTY_PRINT) . PHP_EOL;
        
        return $responseData;
    }
}

// Configura il tuo Token API e il tuo Spatial Map AppId
$config = [
    'baseURL' => 'https://armap-api-<cn1|na1>.easyar.com',
    'token' => 'your_token_here',   
    'appId' => 'your_app_id_here'   
];

$mapService = new MapService($config['baseURL'], $config['token'], $config['appId']);

$queryParams = [
    'pageNum' => 1,
    'pageSize' => 5
];

$result = $mapService->listMaps($queryParams);

if ($result) {
    echo PHP_EOL . "=== Success ===" . PHP_EOL;
} else {
    echo PHP_EOL . "=== Failed ===" . PHP_EOL;
}
?>

Creare un nuovo file di codice correlato list_map.py, modificare le variabili globali, quindi eseguire

pip install requests
python list_map.py

import time
import hashlib
import requests

# --- Configurazione globale ---
API_KEY = "YOUR_API_KEY"
API_SECRET = "YOUR_API_SECRET"
APP_ID = "YOUR_APP_ID"
HOST = "https://armap-api-<cn1|na1>.easyar.com"

def main():
    timestamp = str(int(time.time() * 1000))
    
    # 1. Preparare i parametri
    params = {
        'apiKey': API_KEY,
        'appId': APP_ID,
        'timestamp': timestamp,
        'pageNum': '1',
        'pageSize': '10'
    }

    # 2. Calcolo della firma
    sorted_keys = sorted(params.keys())
    sign_str = "".join([f"{k}{params[k]}" for k in sorted_keys]) + API_SECRET
    signature = hashlib.sha256(sign_str.encode('utf-8')).hexdigest()

    # 3. Costruire la richiesta
    url = f"{HOST}/maps"
    params['signature'] = signature

    print(f"Recupero mappe spaziali da {url}...")
    response = requests.get(url, params=params)
    print(f"Risposta: {response.text}")

if __name__ == "__main__":
    main()

Crea un nuovo file di codice correlato main.go, modifica le variabili globali e poi eseguilo

go run main.go

main.go:

package main

import (
  "crypto/sha256"
  "fmt"
  "io"
  "net/http"
  "sort"
  "strconv"
  "time"
)

var (
  ApiKey    = "YOUR_API_KEY"
  ApiSecret = "YOUR_API_SECRET"
  AppId     = "YOUR_APP_ID"
  Host      = "https://armap-api-<cn1|na1>.easyar.com"
)

func main() {
  ts := strconv.FormatInt(time.Now().UnixNano()/1e6, 10)
  params := map[string]string{
    "apiKey":    ApiKey,
    "appId":     AppId,
    "timestamp": ts,
    "pageNum":   "1",
    "pageSize":  "10",
  }

  // 1. Sort keys
  keys := make([]string, 0, len(params))
  for k := range params { keys = append(keys, k) }
  sort.Strings(keys)

  // 2. Build string and sign
  builder := ""
  for _, k := range keys { builder += k + params[k] }
  builder += ApiSecret

  signature := fmt.Sprintf("%x", sha256.Sum256([]byte(builder)))

  // 3. Request
  url := fmt.Sprintf("%s/maps?apiKey=%s&appId=%s&timestamp=%s&pageNum=%s&pageSize=%s&signature=%s", 
    Host, ApiKey, AppId, ts, params["pageNum"], params["pageSize"], signature)
  
  resp, _ := http.Get(url)
  defer resp.Body.Close()
  body, _ := io.ReadAll(resp.Body)
  fmt.Printf("Response: %s\n", string(body))
}

Aggiungi le dipendenze reqwest, tokio, sha2, hex in Cargo.toml.

Esegui cargo run.

use sha2::{Sha256, Digest};
use std::collections::BTreeMap;
use std::time::{SystemTime, UNIX_EPOCH};

const API_KEY: &str = "YOUR_API_KEY";
const API_SECRET: &str = "YOUR_API_SECRET";
const APP_ID: &str = "YOUR_APP_ID";
const HOST: &str = "https://armap-api-<cn1|na1>.easyar.com";

#[tokio::main]
async fn main() -> Result<(), Box<dyn std::error::Error>> {
    let ts = SystemTime::now().duration_since(UNIX_EPOCH)?.as_millis().to_string();

    // 1. Signature components in BTreeMap (sorted by key)
    let mut params = BTreeMap::new();
    params.insert("apiKey", API_KEY);
    params.insert("appId", APP_ID);
    params.insert("timestamp", &ts);
    params.insert("pageNum", "1");
    params.insert("pageSize", "10");

    // 2. Concatenate and add Secret
    let mut sign_str = String::new();
    for (k, v) in &params {
        sign_str.push_str(k);
        sign_str.push_str(v);
    }
    sign_str.push_str(API_SECRET);
    
    let mut hasher = Sha256::new();
    hasher.update(sign_str.as_bytes());
    let signature = hex::encode(hasher.finalize());

    // 3. Request
    let url = format!("{}/maps?apiKey={}&appId={}&timestamp={}&pageNum=1&pageSize=10&signature={}", 
                      HOST, API_KEY, APP_ID, ts, signature);
    
    let res = reqwest::get(url).await?;
    println!("Response: {}", res.text().await?);
    Ok(())
}

Crea un progetto .NET console.

dotnet new console
dotnet run

using System;
using System.Collections.Generic;
using System.Linq;
using System.Security.Cryptography;
using System.Text;
using System.Net.Http;

class Program {
    static string API_KEY = "YOUR_API_KEY";
    static string API_SECRET = "YOUR_API_SECRET";
    static string APP_ID = "YOUR_APP_ID";
    static string HOST = "https://armap-api-<cn1|na1>.easyar.com";

    static async System.Threading.Tasks.Task Main() {
        string timestamp = DateTimeOffset.Now.ToUnixTimeMilliseconds().ToString();

        // 1. Costruisci parametri ordinati
        var dict = new SortedDictionary<string, string> {
            { "apiKey", API_KEY },
            { "appId", APP_ID },
            { "timestamp", timestamp },
            { "pageNum", "1" },
            { "pageSize", "10" }
        };

        // 2. Concatenare e aggiungere Secret
        StringBuilder sb = new StringBuilder();
        foreach (var kv in dict) sb.Append(kv.Key).Append(kv.Value);
        sb.Append(API_SECRET);
        
        string signature = Sha256(sb.ToString());

        // 3. Esegui richiesta GET
        using var client = new HttpClient();
        string query = string.Join("&", dict.Select(x => $"{x.Key}={x.Value}")) + $"&signature={signature}";
        string url = $"{HOST}/maps?{query}";
        
        var response = await client.GetAsync(url);
        Console.WriteLine($"Risultato: {await response.Content.ReadAsStringAsync()}");
    }

    static string Sha256(string str) {
        byte[] bytes = SHA256.HashData(Encoding.UTF8.GetBytes(str));
        return BitConverter.ToString(bytes).Replace("-", "").ToLower();
    }
}

Ambiente di esecuzione
- Unity 2020 LTS o superiore
- Scripting Backend: Mono o IL2CPP
- API Compatibility Level: .NET Standard 2.1 (consigliato)

Step 1: Preparare i file

Creare una directory nel progetto Unity:

Assets/
└── Scripts/
     └── ListMap.cs

Copiare il codice di esempio ListMap.cs
- nella directory Assets/Scripts/

using System.Collections;
using UnityEngine;
using UnityEngine.Networking;

public class ListMap : MonoBehaviour
{
    [Header("Config")]
    public string apiBaseUrl = "https://armap-api-<cn1|na1>.easyar.com";
    public string authorizationToken = "YOUR API KEY AUTH TOKEN"; 
    public string spatialMapAppId = "SpatialMap-AppId"; 
    public int pageSize = 5; 
    public int pageNum  = 1; 
     
    private void Start()
    {
        StartCoroutine(ListMaps());
    }

    private IEnumerator ListMaps()
    {
     
        string url =
            $"{apiBaseUrl}/maps?appId={spatialMapAppId}&pageSize={pageSize}&pageNum={pageNum}";

        UnityWebRequest request = UnityWebRequest.Get(url);
        request.downloadHandler = new DownloadHandlerBuffer();

        request.SetRequestHeader("Content-Type", "application/json");
        request.SetRequestHeader("Authorization", authorizationToken);

        yield return request.SendWebRequest();

        if (request.result == UnityWebRequest.Result.Success)
        {
            Debug.Log("List maps success:");
            Debug.Log(request.downloadHandler.text);
        }
        else
        {
            Debug.LogError("List maps failed:");
            Debug.LogError(request.error);
            Debug.LogError(request.downloadHandler.text);
        }
    }
}

Nell'Editor Unity:
- Creare un GameObject vuoto
- Assegnare il nome "ListMap"
- Trascinare lo script ListMap su questo oggetto

Step 3: Configurare i parametri (Inspector)

Modificare nell'Inspector:
- Api Url
- Authorization Token
- Spatial Map App Id
- page size
- page num
Modificare solo questi campi con i parametri preparati, poi eseguire

Step 4: Eseguire

Fare clic su Play
Controllare il risultato nella Console:
- Successo: JSON restituito (con result)
- Errore: Messaggio HTTP / di errore

Argomento successivo: