This blog post explains how to get information about earthquake locations on Google map with magnitude and date. If you want to learn how Angular works, how integration using REST API works, then this example will guide you in right direction.
City Search box – You can search any location on planet. Google API is used to locate this location in Map component. If more than one location found then internally it automatically displays first location.
Google Map – This component displays location in Map. Earthquake locations are displayed as bubble. Earthquake magnitude and time is displayed on tool-tip. You need to get your API key so that Google Map will work with your code. In this demo, you will find my API key however I would suggest not to use it as it may run under limit usage
Largest Earthquake in 12 months – This application uses geonames.org website. It hosts publicly consumable web services. One of the important part of API is that it needs four direction bounds and Google Maps API is one of right candidate which provides these values and can be used with geonames API. You can see how Google and geonames both works together in below example.
We are not using any Apex controller because Ajax library from AngularJs is used to call webservice and JSON is extracted and displayed on UI by using Angular.
Do not forget to add Google and geonames URL in remote site settings so that Salesforce should be able to communicate with these external websites.
I have used Bootstrap as well to make user interface more intuitive
In this article, I will show very simple Hello world program using React framework.
I have written many articles on Node.js and AngularJs. In this article, I will demonstrate how to use PostgreSQL with Node.js and deploy on Heroku. I think you already smelled that this is one of starting article which will finally merged with Salesforce to create some cool application.
In this article, we will be creating TypeAhead Directive (Auto Complete) again in Salesforce However this time we will use AngularJs. Why we are using AngularJS ? We discussed already in one of article.
Getting Remote Data in JSON format using AJAX from:
To get data from remote source, we are using same code “Visualforce Account_JSON” and “Controller AccountJSONCreator ” explained in this article. Only thing I have added in wrapper class is ID field.
Dependency injection is a software design pattern that allows the removal of hard-coded dependencies and makes it possible to change them, whether at run-time or compile-time.
Before going to DI first we have to know about Service.
What is Service , factory or Provider in AngularJs?
They all are same, with different way of writing. This (Singleton design pattern) defines dependency between your controller and View through application.
We can Inject a service in Controller, which will watch over changes automatically and change its View as per required.
So what is so special about this framework, other than its developed by Google ?
Unlike Backbone and Ember, You don’t have to spend time on Event Handling (Bind, UnBind Events etc).
It Works on principal of Dirty Checking.
Automatically fires event if something gets changed.
What ? Dirty checking ? wouldn’t it be performance impact on my web application?
You are correct. But Google team has answer for this.
AngularJS performance mainly linked to your computer (Client’s Computer) performance.
Ergonomical point of view, an HTML page should not have more than 200 fields. More fields will just distract users.