Original citywide bus tagging system (2)

Previous Article: citywide public transit tagging system

 

In the previous article, we talked about how to use mapabc data and Baidu map to mark public transit throughout the city. In practice, it is very complicated. So I used a much simpler method to achieve my goal. First take a look:

 

The implementation method is divided into three phases, which are described as follows:

 

(1) prepare data. First, use the JS script to capture Bus Route data and bus station data from mapabc.com throughout Beijing. The data format is as follows:

VaR bus_lines = new array (<br/> [110100011384, "1 Road (-- sihui)", "116.280793, 39.88953, 116.285411 ,..... (bus points along the way, omitted) "] <br/>); </P> <p> var bus_stations = new array (<br/> [110100011384, "factory New Village", 116.280793, 39.88953], <br/> [110100011384," factory Village", 116.289163, 39.889537], <br/> [110100011384, "Lianbao intersection East", 116.296119, 39.88955], <br/> [110100011384, "Ma Guanying West", 116.302096, 39.889698], <br/> [110100011384, "Ma Guanying", 116.306156, 39.889928], <br/> [110100011384, "liuli bridge north", 116.310587, 39.88786], <br/> [110100011384, "Gongzhufen South ", 116.310551, 39.90272], <br/> [110100011384, "", 116.312017, 39.906172], <br/> [110100011384, "Military Museum", 116.325902, 39.907398] <br/> );

 

(2) convert the data into a data structure that can be identified by JS. Two methods are used before and after conversion:

Method 1: format the data into a JS array and save it as data. js. You can use <SCRIPT src = "data. js"/> to import the data directly. This method is simple and requires no server code, but its disadvantage is obvious: Data. js occupies 11 MB of space and the download speed is extremely slow. System Implemented by this method: http://xzaoshu.com/raywill/solu/

Method 2: format the data into MySQL and use phpMyAdmin to import it to the database. The advantage of this method is that the data loading speed is fast and the user wait time is short. There are also many disadvantages. First, you need to write the code for operating the database on the server (PHP + MySQL), and then write the client data acquisition code (jquery + JSON ), in addition, each query needs to interact with the server, and each query of the map needs to wait for the server results. System Implemented by this method: http://xzaoshu.com/raywill/solu2/client/

 

Finally, we chose solution 2 as solution 1 consumes 2 ~ 4 minutes. It's too long. Even if Javascript compression is attempted, the effect is still unsatisfactory. If you select solution 1, you need to write js code for all operations, including locating the nearest bus and finding the corresponding bus line. Select solution 2 to make full use of SQL statements for query, which is very convenient.

 

 

(3) Compile the client JS Code to display the data on the map. Here, because the coordinates of mapabc.com and Baidu maps are inconsistent (it seems that the coordinates of all MAP websites are different from each other. Alas, it's really not necessary !), So I gave up using Baidu maps, but directly used mapabc.com maps. Speed is good ~

 

 

If you are interested, you can follow me: http://weibo.com/raywill2