Home > Article > Web Front-end > Example of the combination of AngularJS and Baidu Maps
A project I am working on now is angular, but I introduced js by directly referencing Baidu Map, and wrote html and js code. I found that I went and reported an error. I thought at first that there was a conflict between Baidu Map and angular, and then I went to search and found that angular also has a Baidu map plug-in. Unfortunately, I used it and reported an error. It said on the Internet that you need to use the angular2 version to be compatible, but I didn’t know how to download the 2 version, so I gave up. Then, I I went to solve the mistake I made at the beginning, and found that I was stupid. First, let’s talk about how to use Baidu Maps. It’s very simple. First, introduce js
2fb9b43e152bf972483f7286c00a6f072cacc6d41bbb37262a98f745aa00fbf0
Explain that you can find the secret key on Baidu Map’s api official website Apply
and then html
4fda439add4228567aa1d2a1810ddfe016b28748ea4df4d9c2150843fecfba68
Then when you get there, just go to the js code. In fact, all of these APIs are available, but I'll post them anyway
var map = new BMap.Map("map"); // 创建Map实例 map.centerAndZoom(new BMap.Point(115.864528, 28.687675), 11); // 初始化地图,设置中心点坐标和地图级别 map.addControl(new BMap.MapTypeControl()); //添加地图类型控件 map.setCurrentCity("南昌"); // 设置地图显示的城市 此项是必须设置的 map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
I used these js codes behind the body at first, but an error was reported. What’s wrong? Post it
getscript?v=2.0&ak=your secret key&services=&t=20160928173929:1 Uncaught
TypeError: Cannot read property 'fc' of undefined
Well, this error occurred, let me go, the solution to this error is very simple
Just put the js code under the div where you use the map, and paste the code
That’s it, no error was reported, and the map was presented perfectly. Let me go. In the final analysis, I was too stupid. I thought there was a conflict with angular. Then I thought about it, it’s impossible, and then I didn’t research the Baidu plug-in for angular