Öğretici: Kamera resimlerindeki Azure hizmeti logolarını tanıma

  • Makale

Bu öğreticide, daha büyük bir senaryonun parçası olarak Özel Görüntü İşleme kullanan örnek bir uygulamayı keşfedeceksiniz. Mobil platformlar için bir Xamarin.Forms uygulaması olan AI Görsel Sağlama uygulaması, Azure hizmet logolarının fotoğraflarını analiz eder ve ardından bu hizmetleri kullanıcının Azure hesabına dağıtır. Burada, kullanışlı bir uçtan uca uygulama sunmak için diğer bileşenlerle eşgüdümlü olarak Özel Görüntü İşleme'yi nasıl kullandığını öğreneceksiniz. Uygulama senaryosunun tamamını kendiniz çalıştırabilir veya kurulumun yalnızca Özel Görüntü İşleme bölümünü tamamlayabilir ve uygulamanın bunu nasıl kullandığını keşfedebilirsiniz.

Bu öğretici şunların nasıl yapıldığını gösterir:

  • Azure hizmet logolarını tanımak için özel bir nesne algılayıcısı oluşturun.
  • Uygulamanızı Azure AI Vision ve Özel Görüntü İşleme'ye bağlayın.
  • Uygulamadan Azure hizmetlerini dağıtmak için bir Azure hizmet sorumlusu hesabı oluşturun.

Azure aboneliğiniz yoksa başlamadan önce ücretsiz bir hesap oluşturun.

Önkoşullar

Kaynak kodunu alma

Sağlanan web uygulamasını kullanmak istiyorsanız GitHub'daki AI Görsel Sağlama deposundan uygulamanın kaynak kodunu kopyalayın veya indirin. Source/VisualProvision.sln dosyasını Visual Studio'da açın. Daha sonra, uygulamayı kendiniz çalıştırabilmeniz için proje dosyalarının bazılarını düzenleyeceksiniz.

Nesne algılayıcısı oluşturma

Özel Görüntü İşleme web portalında oturum açın ve yeni bir proje oluşturun. Bir Nesne Algılama projesi belirtin ve Logo etki alanını kullanın; bu, hizmetin logo algılama için iyileştirilmiş bir algoritma kullanmasına olanak sağlar.

Chrome tarayıcısında Özel Görüntü İşleme web sitesindeki yeni proje penceresi

Görüntüleri karşıya yükleme ve etiketleme

Ardından, Azure hizmet logolarının görüntülerini karşıya yükleyip el ile etiketleyerek logo algılama algoritmasını eğitin. AIVisualProvision deposu, kullanabileceğiniz bir dizi eğitim görüntüsü içerir. Web sitesinde Eğitim Görüntüleri sekmesinde Resim ekle düğmesini seçin. Ardından deponun Belgeler/Görüntüler/Training_DataSet klasörüne gidin. Her görüntüdeki logoları el ile etiketlemeniz gerekir, bu nedenle yalnızca bu projeyi test ediyorsanız görüntülerin yalnızca bir alt kümesini karşıya yüklemek isteyebilirsiniz. Kullanmayı planladığınız her etiketin en az 15 örneğini karşıya yükleyin.

Eğitim görüntülerini karşıya yükledikten sonra ekranda ilkini seçin. Etiketleme penceresi görüntülenir. Kutular çizin ve her resimdeki her logo için etiketler atayın.

Özel Görüntü İşleme web sitesinde logo etiketleme

Uygulama belirli etiket dizeleriyle çalışacak şekilde yapılandırılmıştır. Tanımları Source\VisualProvision\Services\Recognition\RecognitionService.cs dosyasında bulabilirsiniz:

private const string TAG_ACTIVE_DIRECTORY = "ACTIVE_DIRECTORY";
private const string TAG_APP_SERVICE = "APP_SERVICE";
private const string TAG_NOTIFICATION_HUBS = "NOTIFICATION_HUBS";
private const string TAG_MOBILE_APPS = "MOBILE_APPS";
private const string TAG_AZURE_SEARCH = "AZURE_SEARCH";
private const string TAG_AZURE_CDN = "CDN";
private const string TAG_AZURE_MACHINE_LEARNING = "MACHINE_LEARNING";
private const string TAG_AZURE_STORAGE = "STORAGE";
private const string TAG_IOT_EDGE = "IOT_EDGE";
private const string TAG_COSMOS_DB = "COSMOS_DB";
private const string TAG_COGNITIVE_SERVICES = "COGNITIVE_SERVICES";
private const string TAG_SQL_DATABASE = "SQL_DATABASE";
private const string TAG_MYSQL_CLEARDB_DATABASE = "MYSQL_CLEARDB_DATABASE";
private const string TAG_REDIS_CACHE = "REDIS_CACHE";
private const string TAG_APP_INSIGHTS = "APPLICATION_INSIGHTS";
private const string TAG_AZURE_FUNCTIONS = "AZURE_FUNCTIONS";

Bir resmi etiketledikten sonra, bir sonrakini etiketlemek için sağa gidin. bitirdiğinizde etiketleme penceresini kapatın.

Nesne algılayıcısını eğitin

Görüntülerinizi görüntülemek için sol bölmede Etiketler anahtarını Etiketli olarak ayarlayın. Ardından modeli eğitmek için sayfanın üst kısmındaki yeşil düğmeyi seçin. Algoritma, yeni görüntülerde aynı etiketleri tanıyacak şekilde eğitilecektir. Ayrıca doğruluk puanları oluşturmak için modeli mevcut görüntülerinizden bazılarında test eder.

Eğitim Görüntüleri sekmesindeki Özel Görüntü İşleme web sitesi. Bu ekran görüntüsünde Eğit düğmesi ana hatlarıyla açıklanmıştır

Tahmin URL'sini alma

Modeliniz eğitildikten sonra uygulamanızla tümleştirmeye hazır olursunuz. Uç nokta URL'sini (uygulamanın sorguladığı modelinizin adresi) ve tahmin anahtarını (uygulamaya tahmin isteklerine erişim vermek için) almanız gerekir. Performans sekmesinde, sayfanın üst kısmındaki Tahmin URL'si düğmesini seçin.

URL adresini ve API anahtarını görüntüleyen Tahmin API'si penceresini gösteren Özel Görüntü İşleme web sitesi

Uç nokta URL'sini ve Prediction-Key değerini Source\VisualProvision\AppSettings.cs dosyasındaki uygun alanlara kopyalayın:

// Custom Vision
public const string CustomVisionPredictionUrl = "INSERT YOUR COMPUTER VISION API URL HERE FOR MAGNETS RECOGNITION";
public const string CustomVisionPredictionKey = "INSERT YOUR COMPUTER VISION PREDICTION KEY HERE FOR MAGNETS RECOGNITION";

Özel Görüntü İşleme kullanımını inceleme

Uygulamanın Özel Görüntü İşleme anahtarınızı ve uç nokta URL'nizi nasıl kullandığını görmek için Source/VisualProvision/Services/Recognition/CustomVisionService.cs dosyasını açın. PredictImageContentsAsync yöntemi, bir görüntü dosyasının bayt akışını ve iptal belirtecini (zaman uyumsuz görev yönetimi için) alır, Özel Görüntü İşleme tahmin API'sini çağırır ve tahminin sonucunu döndürür.

public async Task<PredictionResult> PredictImageContentsAsync(Stream imageStream, CancellationToken cancellationToken)
{
    var client = new HttpClient();
    client.DefaultRequestHeaders.Add("Prediction-key", AppSettings.CustomVisionPredictionKey);

    byte[] imageData = StreamToByteArray(imageStream);

    HttpResponseMessage response;
    using (var content = new ByteArrayContent(imageData))
    {
        content.Headers.ContentType = new MediaTypeHeaderValue("application/octet-stream");
        response = await client.PostAsync(AppSettings.CustomVisionPredictionUrl, content);
    }

    var resultJson = await response.Content.ReadAsStringAsync();
    return JsonConvert.DeserializeObject<PredictionResult>(resultJson);
}

Bu sonuç, Tahmin örneklerinin listesini içeren bir PredictionResult örneği biçimini alır. Tahmin, algılanan bir etiketi ve görüntüdeki sınırlayıcı kutu konumunu içerir.

public class Prediction
{
    public double Probability { get; set; }

    public string TagId { get; set; }

    public string TagName { get; set; }

    public BoundingBox BoundingBox { get; set; }
}

Uygulamanın bu verileri nasıl işlediği hakkında daha fazla bilgi edinmek için GetResourcesAsync yöntemiyle başlayın. Bu yöntem Source/VisualProvision/Services/Recognition/RecognitionService.cs dosyasında tanımlanır.

Metin tanıma ekleme

Öğreticinin Özel Görüntü İşleme bölümü tamamlandı. Uygulamayı çalıştırmak istiyorsanız Azure AI Vision hizmetini de tümleştirmeniz gerekir. Uygulama, logo algılama işlemini desteklemek için Azure AI Vision metin tanıma özelliğini kullanır. Bir Azure logosu, görünümü veya yanında yazdırılan metin tarafından tanınabilir. Özel Görüntü İşleme modellerinin aksine Azure AI Vision, görüntüler veya videolar üzerinde belirli işlemleri gerçekleştirmek için önceden eğitilir.

Anahtar ve uç nokta URL'sini almak için Azure AI Vision hizmetine abone olun. Bu adım hakkında yardım için bkz. Anahtarları alma.

Hızlı Başlangıç menüsünün seçili olduğu Azure portalındaki Azure AI Vision hizmeti. API uç noktası URL'si gibi anahtarlar için bir bağlantı ana hatlarıyla gösterilir

Ardından Source\VisualProvision\AppSettings.cs dosyasını açın ve ve ComputerVisionKey değişkenlerini doğru değerlerle doldurunComputerVisionEndpoint.

// Computer Vision
public const string ComputerVisionEndpoint = "INSERT COMPUTER VISION ENDPOINT HERE FOR HANDWRITING";
public const string ComputerVisionKey = "INSERT YOUR COMPUTER VISION KEY HERE FOR HANDWRITING";

Hizmet sorumlusu oluşturma

Uygulama, Azure aboneliğinize hizmet dağıtmak için bir Azure hizmet sorumlusu hesabı gerektirir. Hizmet sorumlusu, Azure rol tabanlı erişim denetimini kullanarak bir uygulamaya belirli izinleri devretmenizi sağlar. Daha fazla bilgi edinmek için hizmet sorumluları kılavuzuna bakın.

Burada gösterildiği gibi Azure Cloud Shell veya Azure CLI kullanarak hizmet sorumlusu oluşturabilirsiniz. Başlamak için oturum açın ve kullanmak istediğiniz aboneliği seçin.

az login
az account list
az account set --subscription "<subscription name or subscription id>"

Ardından hizmet sorumlunuzu oluşturun. (Bu işlemin tamamlanması biraz zaman alabilir.)

az ad sp create-for-rbac --name <servicePrincipalName> --role Contributor --scopes /subscriptions/<subscription_id> --password <yourSPStrongPassword>

Başarıyla tamamlandığında, gerekli kimlik bilgileri de dahil olmak üzere aşağıdaki JSON çıkışını görmeniz gerekir.

{
  "clientId": "(...)",
  "clientSecret": "(...)",
  "subscriptionId": "(...)",
  "tenantId": "(...)",
  ...
}

ve tenantId değerlerini not clientId alın. Bunları Source\VisualProvision\AppSettings.cs dosyasındaki uygun alanlara ekleyin.

/* 
 * Service principal
 *
 * Note: This settings will only be used in Debug mode to avoid developer having to enter
 * ClientId and TenantId keys each time application is deployed.
 * In Release mode, all credentials will be introduced using UI input fields.
 */
public const string ClientId = "INSERT YOUR CLIENTID HERE";
public const string TenantId = "INSERT YOUR TENANTID HERE";

Uygulamayı çalıştırma

Bu noktada uygulamaya şu erişim iznini verdiniz:

  • Eğitilmiş bir Özel Görüntü İşleme modeli
  • Azure AI Vision hizmeti
  • Hizmet sorumlusu hesabı

Uygulamayı çalıştırmak için şu adımları izleyin:

  1. Visual Studio Çözüm Gezgini'nde VisualProvision.Android projesini veya VisualProvision.iOS projesini seçin. Ana araç çubuğundaki açılan menüden ilgili öykünücüyü veya bağlı mobil cihazı seçin. Ardından uygulamayı çalıştırın.

    Not

    iOS öykünücüsü çalıştırmak için bir macOS cihazına ihtiyacınız olacaktır.

  2. İlk ekranda hizmet sorumlusu istemci kimliğinizi, kiracı kimliğinizi ve parolanızı girin. Oturum Aç düğmesini seçin.

    Not

    Bazı öykünücülerde Oturum Aç düğmesi bu adımda etkinleştirilmemiş olabilir. Bu durumda uygulamayı durdurun, Source/VisualProvision/Pages/LoginPage.xaml dosyasını açın, LOGIN BUTTON etiketli öğeyi bulunButton, aşağıdaki satırı kaldırın ve uygulamayı yeniden çalıştırın.

    IsEnabled="{Binding IsValid}"

    Hizmet sorumlusu kimlik bilgileri için alanları gösteren uygulama ekranı

  3. Sonraki ekranda açılan menüden Azure aboneliğinizi seçin. (Bu menü, hizmet sorumlunuzun erişimi olan tüm abonelikleri içermelidir.) Devam düğmesini seçin. Bu noktada uygulama sizden cihazın kamerasına ve fotoğraf depolama alanına erişim izni vermenizi isteyebilir. Erişim izinleri verin.

    Hedef Azure aboneliği için açılan alanı gösteren uygulama ekranı

  4. Cihazınızdaki kamera etkinleştirilir. Eğitmiş olduğunuz Azure hizmeti logolarından birinin fotoğrafını çekin. Dağıtım penceresi, yeni hizmetler için bir bölge ve kaynak grubu seçmenizi istemelidir (azure portaldan dağıtırken yaptığınız gibi).

    Azure logolarının iki kağıt parçasına odaklanan bir akıllı telefon kamera ekranı

    Dağıtım bölgesi ve kaynak grubu alanlarını gösteren uygulama ekranı

Kaynakları temizleme

Bu senaryonun tüm adımlarını izlediyseniz ve azure hizmetlerini hesabınıza dağıtmak için uygulamayı kullandıysanız Azure portalında oturum açın. Burada, kullanmak istemediğiniz hizmetleri iptal edin.

Özel Görüntü İşleme ile kendi nesne algılama projenizi oluşturmayı planlıyorsanız, bu öğreticide oluşturduğunuz logo algılama projesini silmek isteyebilirsiniz. Özel Görüntü İşleme için ücretsiz bir abonelik yalnızca iki proje için izin verir. Logo algılama projesini silmek için Özel Görüntü İşleme web sitesindeProjeler'i açın ve Yeni Projem'in altındaki çöp kutusu simgesini seçin.

Sonraki adımlar

Bu öğreticide, mobil kamera görüntülerindeki logoları algılamak için Özel Görüntü İşleme hizmetini kullanan tam özellikli bir Xamarin.Forms uygulamasını ayarladınız ve keşfettiniz. Ardından, özel görüntü işleme modeli oluşturmaya yönelik en iyi yöntemleri öğrenerek kendi uygulamanız için bir model oluşturduğunuzda modeli güçlü ve doğru hale getirebilirsiniz.

Sınıflandırıcınızı geliştirme