Baidu Map Road Book delete annotations, get playback progress method, to achieve road book playback function

Source: Internet
Author: User
Tags polyline

First put a picture, this is the end of the road book display effect

1, demand--2, solutions--3, implementation Method--4, subsequent expansion

1. Demand

Demand is probably like, to achieve the progress of the book play, you can forward back, pause, when the mouse hover trolley display location information (callout)

Subsequent (playback speed modification)

2, solve the idea

The original idea: I threw a bunch of coordinates points to the road Book API, the road book should have the way forward, pause, back, and then I get the next play progress, I write a control bar mapping is almost. As for the label, I didn't think much at the time.

However, the road book provides the following methods: http://api.map.baidu.com/library/LuShu/1.2/docs/symbols/BMapLib.LuShu.html

Except for the beginning, the pause is useful, the others are not

Difficulty: Forward, rewind, get playback progress

3. Solutions

To know the premise:

1, this progress bar is not played in the dimension of time, but with the coordinate point (usually the progress bar is 1s forward, this is a coordinate point to advance a bit)

2,Bmaplib.lushu(map, Path, opts)

      {map} map An instance object of the Baidu map.

      {Array} path constitutes an array of point for the alignment.

      {Json Object} opts Optional input parameter, not required (see above link for details)

Forward and backward thinking:

As long as you modify the path each time, restart the road book, you can achieve a similar effect of forward and backward

All we have to do is clear off the last road book.

How to clean up?

1, call Map.clearoverlays (); , then redraw the polyline, and then start the road book (or set the polyline directly to not be cleared)

2, Lushu.stop () and then Lushu.start (), will find the road book to start again, there must be a clear operation in the middle, key out to execute once just fine


Clear Code
//added to A.object.extend (c.prototype,{}) in the second argument_clearmark:function(f) { This. Stop (); This. _map.removeoverlay ( This. _marker); Cleartimeout ( This. _timeoutflag) His._overlay&& This. _map.removeoverlay ( This. _overlay); },//external exposure Call method C.prototype.start with this.C.prototype.clear=function(){ This. _clearmark (); };

  

Get Playback progress:

Idea: The first thought is the direct return progress (percent type), and later thought that the current path in the path ( Bmaplib.lushu(map, Path, opts)) may not be a collection of all distances, so can not locate the progress. You can directly return to the current progress of the coordinate point, the progress of their own positioning.

The movement of a road book trolley is to traverse the path collection through a timer, then clear the maker of the previous coordinate point and add the next maker. So, we can save the coordinate point of this change in the middle, and then provide a method to get it. Here is a pit is not the critical point, because the judgment of the timer to clear the conditions, not only to determine whether the coordinate point is finished, there are travel speed and the distance between the last few points to determine if there is a need to move the car. So at these critical points (start, end), you need to manually specify the value of the returned coordinate.

There's a lot of this change, no code.

    

Other:

1, as for the label, is in the mobile car when adding a monitoring event, add the corresponding information window. Then erase the last listener event on the next move.

2, speed adjustment, direct dynamic modification of the road book configuration parameters, not yet tested

    

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.