Circle Component

Properties

description
  Sets or gets the description displayed in the info window. The info window appears when the user taps on the Circle.
Data type: string
Designer Writable true <circle name="circleName" description="Test description">
Code Writeable true circleName.description = "Test description"
Code Readable true let variable = circleName.description

draggable
  Sets or gets whether or not the user can drag a map feature. This feature is accessed by long-pressing and then dragging the Circle to a new location.
Data type: boolean
Designer Writable true <circle name="circleName" draggable="true">
Code Writeable true circleName.draggable = true
Code Readable true let variable = circleName.draggable

enableInfobox
  Enables or disables the infobox window display when the user taps the Circle.
Data type: boolean
Designer Writable true <circle name="circleName" enableInfobox="true">
Code Writeable true circleName.enableInfobox = true
Code Readable true let variable = circleName.enableInfobox

fillColor
  Sets or gets the color used to fill in the Circle.
Data type: color
Designer Writable true <circle name="circleName" fillColor="FF2a6186">
Code Writeable true circleName.fillColor = "FF2a6186"
Code Readable true let variable = circleName.fillColor

fillOpacity
  Sets or gets the opacity of the color used to fill the Circle. A value of 0.0 will be completely invisible and a value of 1.0 will be completely opaque.
Data type: number
Designer Writable true <circle name="circleName" fillOpacity="1">
Code Writeable true circleName.fillOpacity = 1
Code Readable true let variable = circleName.fillOpacity

latitude
  Sets or gets the latitude of the center of the circle, in degrees. Positive values represent north of the equator and negative values represent south of the equator. To update the latitude and longitude simultaneously, use the SetLocation method.
Data type: number
Designer Writable true <circle name="circleName" latitude="-27.5083">
Code Writeable true circleName.latitude = -27.5083
Code Readable true let variable = circleName.latitude

longitude
  Sets or gets the longitude of the center of the circle, in degrees. Positive values represent east of the prime meridian and negative values represent west of the prime meridian. To update the latitude and longitude simultaneously, use the SetLocation method.
Data type: number
Designer Writable true <circle name="circleName" longitude="152.9281">
Code Writeable true circleName.longitude = 152.9281
Code Readable true let variable = circleName.longitude

radius
  Sets or gets the radius of the circle, in meters.
Data type: number
Designer Writable true <circle name="circleName" radius="30">
Code Writeable true circleName.radius = 30
Code Readable true let variable = circleName.radius

strokeColor
  Sets or gets the color used to outline the Circle.
Data type: color
Designer Writable true <circle name="circleName" strokeColor="FF98d5a9">
Code Writeable true circleName.strokeColor = "FF98d5a9"
Code Readable true let variable = circleName.strokeColor

strokeOpacity
  Sets or gets the opacity of the outline of the Circle. A value of 0.0 will be invisible and a value of 1.0 will be opaque.
Data type: number
Designer Writable true <circle name="circleName" strokeOpacity="0.5">
Code Writeable true circleName.strokeOpacity = 0.5
Code Readable true let variable = circleName.strokeOpacity

strokeWidth
  Sets or gets the width of the stroke used to outline the Circle.
Data type: number
Designer Writable true <circle name="circleName" strokeWidth="1">
Code Writeable true circleName.strokeWidth = 1
Code Readable true let variable = circleName.strokeWidth

title
  Sets or gets the title displayed in the info window that appears when the user clicks on the map feature.
Data type: string
Designer Writable true <circle name="circleName" title="Test title">
Code Writeable true circleName.title = "Test title"
Code Readable true let variable = circleName.title

type
  Returns the type of the feature. For Circles, this returns MapFeature.Circle ("Circle").
Data type: string
Designer Writable false
Code Writeable false
Code Readable true let variable = circleName.type

visible
  Specifies whether the Circle should be visible on the screen. Value is true{
Data type: boolean
Designer Writable true <circle name="circleName" visible="true">
Code Writeable true circleName.visible = true
Code Readable true let variable = circleName.visible

class
  The styling class of the the component
Data type: string
Designer Writable true <circle name="circleName" class="Test class">
Code Writeable false
Code Readable false

id
  The styling id of the the component
Data type: string
Designer Writable true <circle name="circleName" id="Test id">
Code Writeable false
Code Readable false

name
  The name of the component that will be used to refer to it in code.
Data type: string
Designer Writable true <circle name="circleName" name="testComponent">
Code Writeable false
Code Readable false

Methods

Method name Description Parameters
distanceToFeature Computes the distance between the Circle and the given mapFeature. If centroids is true, the computation is done between the centroids of the two features. Otherwise, the distance will be computed between the two features based on the closest points. Further, when centroids is false, this method will return 0 if the Circle intersects or contains the mapFeature. If an error occurs, this method will return -1.
circleName.distanceToFeature(mapFeature, centroids)
circleName.distanceToFeature("componentName", true)
mapFeature component
centroids boolean
distanceToPoint Computes the distance between the Circle and the given latitude and longitude. If centroids is true, the distance is computed from the center of the Circle to the given point. Otherwise, the distance is computed from the closest point on the Circle to the given point. Further, this method will return 0 if centroids is false and the point is in the Circle. If an error occurs, -1 will be returned.
circleName.distanceToPoint(latitude, longitude, centroid)
circleName.distanceToPoint(-27, 152, true)
latitude number
longitude number
centroid boolean
hideInfobox Hides the Circle's info box if it is visible. Otherwise, no action is taken.
circleName.hideInfobox()
setLocation Moves the center of the Circle to the given latitude and longitude. This method is more efficient than setting Latitude and Longitude separately.
circleName.setLocation(latitude, longitude)
circleName.setLocation(-27.5083, 152.9281)
latitude number
longitude number
showInfobox Shows the info box for the Circle if it is not visible. Otherwise, this method has no effect. This method can be used to show the info box even if EnableInfobox is false.
circleName.showInfobox()
addEventListener Method used to create event listeners.
See Events below for samples.
eventName string
eventCallbackFunction callback

Events

Event name Description Parameters
click The Click event runs when the user taps on the Circle.
circleName.addEventListener(
    "click",
    function () {
        //Your code here
    }
)
drag The Drag event runs in response to position updates of the Circle as the user drags it.
circleName.addEventListener(
    "drag",
    function () {
        //Your code here
    }
)
longClick The LongClick event runs when the user presses and holds the Circle and then releases it. This event will only trigger if Draggable is false because it uses the same gesture as StartDrag.
circleName.addEventListener(
    "longClick",
    function () {
        //Your code here
    }
)
startDrag The StartDrag event runs when the user presses and holds the Circle and then proceeds to move their finger on the screen. It will be followed by the Drag and StopDrag events.
circleName.addEventListener(
    "startDrag",
    function () {
        //Your code here
    }
)
stopDrag The StopDrag event runs when the user releases the Circle at the end of a drag.
circleName.addEventListener(
    "stopDrag",
    function () {
        //Your code here
    }
)