• Home
  • Pricing
  • Free Resources
  • About
  • Docs
  • Support
  • Account

Gravity Wiz

Magically enhanced tutorials, snippets and plugins for Gravity Forms!

  • Gravity Perks
    • Gravity Perks
    • Pricing
  • Blog
    • Free Resources
    • About
  • Support
    • Docs
    • Support
    • Account

gpaa_marker_set (JS)

  1. Description
  2. Usage
  3. Parameters
  4. Since
  5. Examples
    1. Add an Info Window to the Marker
    2. Add a circle to the Marker

Description

Action fired after a marker has been placed on a map field. It allows you to programmatically make updates to the marker and map when a marker is placed.

Usage

window.gform.addAction( 'gpaa_marker_set', 'my_custom_function' );

Parameters

  • params.formId int

    ID of the form the map field is in.

  • params.fieldId int

    ID of the map field the marker was added to.

  • params.addressFieldId int

    ID of the address field the map field is attached to.

  • params.map object

    The Google API map object that the marker was added to.

  • params.marker object

    The Google API marker object that was added to the map.

Since

This filter is available since Gravity Forms Address Autocomplete 1.2.3.

Examples

Add an Info Window to the Marker

Adds an Info Window to the marker, but only after an address has been autocompleted.

// if the connected address field has been autofilled, place an info window
window.gform.addAction( 'gpaa_marker_set', ( { formId, fieldId, addressFieldId, map, marker } ) => {
	var infoWindow = new google.maps.InfoWindow({
	    content: '<div><strong>Delivery Location</strong><br><p>Your package will be delivered here on 29, August 2022.</p></div>',
	});

	infoWindow.open({
	    anchor: marker,
	    map: map,
	});
});

Add a circle to the Marker

// Keep track of the circle for the selected location that way circles can be removed if the location changes.
var currentCircle;

window.gform.addAction( 'gpaa_marker_set', function ( {formId, fieldId, addressFieldId, map, marker} ) {
	if ( currentCircle ) {
		currentCircle.setMap( null );
	}

	currentCircle = new google.maps.Circle( {
		// Start customizing
		radius: 100, // In meters
		strokeColor: "#FF0000",
		strokeOpacity: 0.8,
		strokeWeight: 2,
		fillColor: "#FF0000",
		fillOpacity: 0.35,
		// End customizing
		map: map,
		center: marker.position,
	} );
} );

All Perks

  • GF Address Autocomplete
  • GF Advanced Calculations
  • GF Advanced Phone Field
  • GF Advanced Save & Continue
  • GF Auto List Field
  • GF Auto Login
  • GF Better User Activation
  • GF Blocklist
  • GF Conditional Logic Dates
  • GF Conditional Pricing
  • GF Copy Cat
  • GF Date Time Calculator
  • GF Disable Entry Creation
  • GF Easy Passthrough
  • GF eCommerce Fields
  • GF Email Users
  • GF Entry Blocks
  • GF Expand Textareas
  • GF File Renamer
  • GF File Upload Pro
  • GF Google Sheets
  • GF Inventory
  • GF Limit Checkboxes
  • GF Limit Choices
  • GF Limit Dates
  • GF Limit Submissions
  • GF Live Preview
  • GF Media Library
  • GF Multi-Page Navigation
  • GF Nested Forms
  • GF Notification Scheduler
  • GF Page Transitions
  • GF Pay Per Word
  • GF PayPal One-time Fee
  • GF Placeholder
  • GF Populate Anything
  • GF Post Content Merge Tags
  • GF Preview Submission
  • GF Price Range
  • GF QR Code
  • GF Randomizer
  • GF Read Only
  • GF Reload Form
  • GF Terms Of Service
  • GF Unique ID
  • GF Word Count

Copyright © 2023 · Powered by WordPress · Gravity Wiz LLC

  • Support
  • Affiliates
  • About
  • Sitemap
  • Terms & Conditions of Use
  • Privacy Policy
  • Cookies Policy