Widget Type:
Page Widgets
TPC Version:
  • 3.3 +
VideoLogos
CRM Bubble Map is  very similar to PinMap with simple data visualization in form of bubbles. This widget can display Pin Markers and Value Bubbles. This map will also work in the page designer preview.  

Prerequisites 

You will need entities containing an address and a numeric value, typically a CRM Entities with Linked-Entities that hold a numeric value. 
For example: contacts linked to orders.

Configuration

Basic Setup 


Drag and drop the CRM Bubble Map onto a page

1) Click Edit and configure your options in Basic Tab. These are all optional settings.
 

Appearance 


2) Click Appearance Tab and configure your more graphics related options. 

Configure Bubble Color by selecting a from pallets. Or use the KendoUI Dropdown Picker and don't forget to choose transparency level, click Apply when done using the Picker. You can also manually adjust values in a textbox.




Makers

 3) Go to the Marker Tab to drag and drop images. 

Use reasonable rectangular images that are approximately 28 x 40 pixels for best results. 

Feel free to organize them in the Markers Library that was automatically created upon designer load. Then double click on an image to register it as the pin image. 

Click the remove link [remove] to remove the marker if you just need the Bubble Graph. 


FetchXML 


4) Go to FetchXML Tab to configure what CRM data to pull. You can select Entity from Dropdown to use Load Default FetchXML and then Use Builder to configure the fetchXML in a GUI. OR type in the FetchXML manually then Use Builder.

* Make sure you have included a unique identifier and a numeric value in your linked-entity: such as ordernumber and totalamount.
* Do not need to include  aggregate in the linked entity such as Sum because the widget will always sum up the values.



Data


5) Next is the Data Tab: Once fetchXML is configured all dropdown options are dynamically pre-filled with values from FetchXML. 

Choose your Name Attribute for a tool-tip pop-up on an event of mouse over. 

Then choose your type of Address Lookup depending on CRM data entity:
- Use Coordinates: If you have latitude and longitude fields in your entity.
- Use Address: If you have multiple address fiends in the entity: Street, Number, etc
- Use Composite Address: If you have one line address. 

Appropriate attribute dropdown selectors will show up automatically. These dropdown options are also pre-populated from the fetchXML. 

Select Numeric Value Attribute field that is used for data visualization.






6) Fill the optional filters, additional to in-fetchXML filters. 
Use add /remove links [ + ] / [ - ]  to add or remove filters.

7) Save and Publish Page when done.

Widget Properties

Basic Properties

Fetch XML

The FetchXML text area determines what sort of data a widget will be populated with. 

Clicking the Load Default Fetch option will populate the FetchXML area with a default fetch based on the CRM Entity chosen. By clicking the Build button, we will be sent to another page in order to determine what the widget will look up. For more information on how to use the FetchXML function.

Entity

Drop Down: Optional, select entity to use the Load Default FetchXML. Required in Advanced Pin Map: Used to dynamically populate image selectors list to differentiate markers by status.

Marker Type

A string property that hold image url.

 

Bubble Color

3 ways to choose color in the Bubble Map Designer
- Simple Pallet
- Kendo Color Picker with Transparency lever
- Manual text box, use hex-RGB or RGBA styles here.

Data Bubble Shape

Chooses between a Circle (default) or a Square

Zoom Control

Completely optional tool to adjust zoom by clicking on +/- buttons. If not null, Position Sub Property drop down will be available. Type: Boolean

Zoom

You got 20 map zoom levels.

Navigation Control

Completely optional tool to navigate map by clicking arrows. If not null, Position Sub Property drop down will be available. Type: Boolean

Numeric Value Attribute

In Bubble Map: 
- Adjust bubble size.

In Shape Map: 
- dictates the color code of the regions.

In Chart Map: 
- Adjust bar chart size.

Name Attribute

CRM field to be attached to each marker as a tooltip.

Attribution or Comment

Use this to add some info, description, credentials, links or just leave blank.

If not null, Position sub property will be available.

Map Overlay

Over a dozen of map overlay types, available with preview to choose from a nice KendoUI Dropdown.

Map Height ~ advance pin map

Choose a height in pixels (300 is default) and width is determined by the page layout.

Use Coordinates Option

sed when coordinates are registered in the CRM entity. Sub Properties: Latitude and Longitude Dropdowns: to specify the coordinates fields.

Use Composite Address

Used when you have address fields concatenated in one line in CRM. Using this option activates Geocoder. (that uses external apis to pull coordinates)

Use Address

Used when detailed address is registered in CRM on each entity. If true, the following sub properties will be available in drop down boxes. Street Line 1, Street Line 2, City Attribute, Province Attribute, Country Attribute, Postal Attribute. Using this option activates Geocoder. (that uses external apis to pull coordinates)

Center Longitude & Latitude

If Center By Address is null, this property is used instead.
Allows to choose to center by direct coordinates.

Center By Address

Type address by any format you wish, in the background map widget would use google API to select best matching location. So type a full address or just name of the city.

Advanced Properties

Advanced properties provide additional functionality. They can be accessed by clicking on the "Advanced" Button in the bottom right corner of the widget designer.

Fetch XML

The FetchXML text area determines what sort of data a widget will be populated with. 

Clicking the Load Default Fetch option will populate the FetchXML area with a default fetch based on the CRM Entity chosen. By clicking the Build button, we will be sent to another page in order to determine what the widget will look up. For more information on how to use the FetchXML function.

Entity

Drop Down: Optional, select entity to use the Load Default FetchXML. Required in Advanced Pin Map: Used to dynamically populate image selectors list to differentiate markers by status.

Marker Type

A string property that hold image url.

 

Bubble Color

3 ways to choose color in the Bubble Map Designer
- Simple Pallet
- Kendo Color Picker with Transparency lever
- Manual text box, use hex-RGB or RGBA styles here.

Data Bubble Shape

Chooses between a Circle (default) or a Square

Zoom Control

Completely optional tool to adjust zoom by clicking on +/- buttons. If not null, Position Sub Property drop down will be available. Type: Boolean

Zoom

You got 20 map zoom levels.

Navigation Control

Completely optional tool to navigate map by clicking arrows. If not null, Position Sub Property drop down will be available. Type: Boolean

Numeric Value Attribute

In Bubble Map: 
- Adjust bubble size.

In Shape Map: 
- dictates the color code of the regions.

In Chart Map: 
- Adjust bar chart size.

Name Attribute

CRM field to be attached to each marker as a tooltip.

Attribution or Comment

Use this to add some info, description, credentials, links or just leave blank.

If not null, Position sub property will be available.

Map Overlay

Over a dozen of map overlay types, available with preview to choose from a nice KendoUI Dropdown.

Map Height ~ advance pin map

Choose a height in pixels (300 is default) and width is determined by the page layout.

Use Coordinates Option

sed when coordinates are registered in the CRM entity. Sub Properties: Latitude and Longitude Dropdowns: to specify the coordinates fields.

Use Composite Address

Used when you have address fields concatenated in one line in CRM. Using this option activates Geocoder. (that uses external apis to pull coordinates)

Use Address

Used when detailed address is registered in CRM on each entity. If true, the following sub properties will be available in drop down boxes. Street Line 1, Street Line 2, City Attribute, Province Attribute, Country Attribute, Postal Attribute. Using this option activates Geocoder. (that uses external apis to pull coordinates)

Center Longitude & Latitude

If Center By Address is null, this property is used instead.
Allows to choose to center by direct coordinates.

Center By Address

Type address by any format you wish, in the background map widget would use google API to select best matching location. So type a full address or just name of the city.