จัดการกิจกรรมการคลิก

เลือกแพลตฟอร์ม: Android iOS JavaScript

ทำให้ฟีเจอร์ข้อมูลตอบสนองต่อเหตุการณ์ click และใช้ฟีเจอร์ดังกล่าวเพื่อเปลี่ยนลักษณะที่ปรากฏของฟีเจอร์ตามการโต้ตอบของผู้ใช้

เขียนตัวแฮนเดิลกิจกรรมการคลิก

เมื่อเกิดกิจกรรมการคลิกในเลเยอร์ของฟีเจอร์ Maps SDK สำหรับ Android จะส่ง FeatureClickEvent ออบเจ็กต์ไปยังตัวแฮนเดิลเหตุการณ์

ใช้เมธอด FeatureClickEvent.getFeatures() เพื่อรับรายการฟีเจอร์ที่ได้รับผลกระทบจากการคลิก

จัดการเหตุการณ์เลเยอร์ของฟีเจอร์

ทำตามขั้นตอนต่อไปนี้เพื่อจัดการเหตุการณ์ในเลเยอร์ชุดข้อมูล ในตัวอย่างนี้ คุณจะใช้การเติมและเส้นขอบสีน้ำเงินกับรูปหลายเหลี่ยมที่แสดงฟีเจอร์ที่เลือก

หมายเหตุ: ในตัวอย่างนี้ แอตทริบิวต์ globalid ของชุดข้อมูลจะมีตัวระบุที่ไม่ซ้ำกัน สำหรับรูปหลายเหลี่ยมแต่ละรูป จากนั้นคุณสามารถตรวจสอบ globalid ของรูปหลายเหลี่ยมที่คลิกเพื่อใช้การจัดรูปแบบสีน้ำเงินกับรูปหลายเหลี่ยมนั้นเท่านั้น

เมื่อเรียกใช้ FeatureLayer.setFeatureStyle(), ฟังก์ชัน Factory ของสไตล์จะกำหนดสไตล์ฟีเจอร์ให้กับฟ101}ชุดข้อมูล หากต้องการอัปเดตสไตล์ของชุดข้อมูลในเครื่องจัดการเหตุการณ์ คุณต้องเรียกใช้ FeatureLayer.setFeatureStyle() เพื่อกำหนดสไตล์ที่อัปเดตให้กับฟีเจอร์ทั้งหมดของชุดข้อมูล

1. หากยังไม่ได้ดำเนินการ ให้ทำตามขั้นตอนใน เริ่มต้นใช้งาน เพื่อสร้างรหัสแผนที่และสไตล์แผนที่ใหม่ อย่าลืมเปิดใช้เลเยอร์ของฟีเจอร์ชุดข้อมูล

2. ตรวจสอบว่าคลาสของคุณใช้ FeatureLayer.OnFeatureClickListener

3. ลงทะเบียนเครื่องจัดการเหตุการณ์สำหรับเหตุการณ์การคลิกฟีเจอร์โดยเรียกใช้ FeatureLayer.addOnFeatureClickListener()

   Kotlin

   private var datasetLayer: FeatureLayer? = null
   // The globalid of the clicked dataset feature.
   var lastGlobalId: String? = null
   
   override fun onMapReady(googleMap: GoogleMap) {
     // Get the DATASET feature layer.
     datasetLayer = googleMap.getFeatureLayer(FeatureLayerOptions.Builder()
       .featureType(FeatureType.DATASET)
       // Specify the dataset ID.
       .datasetId(YOUR_DATASET_ID)
       .build())
   
     // Register the click event handler for the Datasets layer.
     datasetLayer?.addOnFeatureClickListener(this)
   
     // Apply default style to all features on load to enable clicking.
     styleDatasetsLayer()
   }
   
   // Define the click event handler to set lastGlobalId to globalid of selected feature.
   override fun onFeatureClick(event: FeatureClickEvent) {
     // Get the dataset feature affected by the click.
     val clickFeatures: MutableList<Feature> = event.features
     lastGlobalId = null
     if (clickFeatures.get(0) is DatasetFeature) {
         lastGlobalId = ((clickFeatures.get(0) as DatasetFeature).getDatasetAttributes().get("globalid"))
         // Remember to reset the Style Factory.
         styleDatasetsLayer()
     }
   }

   Java

   private FeatureLayer datasetLayer;
   // The globalid of the clicked dataset feature.
   String lastgobalid = null;
   
   @Override
   public void onMapReady(GoogleMap map) {
   
     // Get the DATASET feature layer.
     datasetLayer = map.getFeatureLayer(new FeatureLayerOptions.Builder()
       .featureType(FeatureType.DATASET)
       // Specify the dataset ID.
       .datasetId(YOUR_DATASET_ID)
       .build());
   
     // Register the click event handler for the Datasets layer.
     datasetLayer.addOnFeatureClickListener(this);
   
     // Apply default style to all features on load to enable clicking.
     styleDatasetsLayer();
   }
   
   @Override
   // Define the click event handler.
   public void onFeatureClick(FeatureClickEvent event) {
     // Get the dataset feature affected by the click.
     List<Feature> clickFeatures = event.getFeatures();
     lastgobalid = null;
     if (clickFeatures.get(0) instanceof DatasetFeature) {
         lastgobalid = ((DatasetFeature) clickFeatures.get(0)).getDatasetAttributes().get("globalid");
         // Remember to reset the Style Factory.
         styleDatasetsLayer();
     }
   }

4. ใช้สีเติมสีน้ำเงินกับฟีเจอร์ที่เลือกและสีเขียวกับฟีเจอร์อื่นๆ ทั้งหมด ฟีเจอร์ที่มองเห็นได้เท่านั้นที่คลิกได้

   Kotlin

   // Set fill and border for all features.
   private fun styleDatasetsLayer() {
       // Create the style factory function.
       val styleFactory = FeatureLayer.StyleFactory { feature: Feature ->
   
       // Check if the feature is an instance of DatasetFeature.
       if (feature is DatasetFeature) {
         val globalIDs: MutableMap<String, String> = feature.getDatasetAttributes()
         // Determine globalid attribute.
         val globalID = globalIDs!!["globalid"]
         // Set default colors to to green.
         var fillColor = 0x800000ff
         var strokeColor = 0xff0000ff
         if (globalID == lastGlobalId) {
           // Color selected area blue.
           fillColor = 0x8000ff00
           strokeColor = 0xff00ff00
         }
         return@StyleFactory FeatureStyle.Builder()
             .fillColor(fillColor)
             .strokeColor(strokeColor)
             .build()
       }
       return@StyleFactory null
     }
   
     // Apply the style factory function to the dataset feature layer.
     datasetLayer?.setFeatureStyle(styleFactory)
   }

   Java

   // Set default green fill and border for all features.
   private void styleDatasetsLayer() {
     // Create the style factory function.
     FeatureLayer.StyleFactory styleFactory = (Feature feature) -> {
   
     // Check if the feature is an instance of DatasetFeature.
     if (feature instanceof DatasetFeature) {
   
       // Check if "globalid" attribute of feature is the "globalid" of clicked feature.
       Map<String, String> globalIDs = ((DatasetFeature) feature).getDatasetAttributes();
       String globalID = globalIDs.get("globalid");
       // Set default colors to green.
       int fillColor = 0x4000ff00;
       int strokeColor = 0xff00ff00;
       if (Objects.equals(globalID, lastgobalid)) {
         // Color selected area blue.
         fillColor = 0x400000ff;
         strokeColor = 0xff0000ff;
       }
       return new FeatureStyle.Builder()
         .fillColor(fillColor)
         .strokeColor(strokeColor)
         .strokeWidth(2)
         .build();
       }
       return null;
     };
   
     // Apply the style factory function to the feature layer.
     datasetLayer.setFeatureStyle(styleFactory);
   }