In recent years, the rapid development of small program ecology is obvious to all. With the increasingly close combination of small programs and offline scenes, map functions have become the “standard” of more and more small programs.
Tencent Location services has been providing low-level mapping support for wechat and miniprograms. At the same time, we have always been in close cooperation with wechat, and constantly consolidate and enrich our map ability under the small program, upgrade the developer’s “toolbox” and “Arsenal”, to meet the small program developers in different business scenarios on the map ability requirements.
The Map API function is updated
Recently, applets have added many new functions to the Map API, including moveAlong, initMarkerCluster, and so on.
moveAlong
MoveAlong helps developers to realize the designated path to move Marker, and the Marker orientation can coordinate with the rotation effect of route orientation, which is mainly applied to track playback, travel and vehicle sharing and other scenes. If the animation is in progress and the moveAlong method is called again on the same marker, the previous animation will be interrupted. In addition, the speed of track playback can be set by setting the duration of smooth movement.
initMarkerCluster
InitMarkerCluster is the point aggregation capability. Too many markers need to be displayed on the map, which may lead to the capping of markers on the interface and incomplete display, and lead to the overall performance deterioration and the user’s use of lag. Aiming at this kind of problem, we launch the point aggregation ability, which shows a lot of Maker through aggregation. For example, in the scenario of large chain stores, when users search for a certain brand chain store in a region or even in a city, and when the local map is enlarged and the whole city is viewed, the point aggregation ability can make the points on the map automatically merge adjacent to achieve the best display effect.
openMapApp
OpenMapApp is used to directly call up the list of map apps installed by users, similar to the scene when wechat sends location, so that users can jump to other map apps to complete route planning or navigation. In previous use scenarios, users could not directly jump to map APP through the mini program, and they had to go to the wechat selection point before jumping to the APP. Not only the steps were tedious, but also the route planning could not be realized when jumping to map APP without carrying the destination position. At present, this function can solve this problem perfectly. Users can directly pull up the map App in their own mini program and show the route planning from the beginning to the end.
FromScreenLocation and toScreenLocation
The applet provides a new set of apis to help developers convert screen coordinates and latitude and longitude to each other. FromScreenLocation can get the longitude and latitude of a point on the screen, and toScreenLocation can get the screen coordinates of the longitude and latitude.
includePoints
IncludePoints are zoom views to show all POIS. When there are multiple POI points in the map and the map only shows part of them, the effect of automatic zooming at the map view level including all points can be achieved through the includePoints ability, and the distance between the rectangular edge formed by coordinate points and the edge of the map can be set through the padding to achieve the best display effect.
Map component optimization
Map field control
Small program Map component Map field control supports zooming, pitching, 3D floor control, and other controls, but also supports the left to right, zoom in and out of the traditional gesture control Map field change. At the same time, the newly added “Zoom level” function can control the zoom range of 3-20 levels, so as to prevent users from changing the map view too large or too small, resulting in poor map display effect and affecting user experience.
Mulch – Rainbow line
Added rainbow line ability. In route planning scenarios, developers can use this ability to report road congestion: red congestion, yellow slow traffic, and green smooth traffic. As a line attribute, rainbow line conflicts with solid line and dashed line.
Map search is fully available
In order to build a complete LBS application, besides map display function, map retrieval ability is also indispensable. We’re WeChat open community service platform launched a series of services, contains four POI data classes (reverse address resolution, address resolution, site search, keyword input prompt), 2 route planning class (drive route planning, route planning on foot), a coordinate tools (coordinate transformation), covers most of the maps application scenario.
Considering that many developers have the demand to expand wechat mini program overseas market, we also provide overseas location interface service in Tencent location service official website, including map, location, address resolution, reverse address resolution, location search, peripheral search, peripheral recommendation, route planning eight overseas service capabilities. Developers can enjoy the ultimate experience of seamless map switching at home and abroad in one access, achieving “one access, access to the world”.
Route planning plug-in optimized and upgraded
The route planning plugin has recently iterated on navigation, real-time transit, theme color and many other capabilities.
Navigation: If route planning is to “see route”, then navigation is to “use route”. The new navigation ability improves the awkward position that route planning can only be viewed but not used, and gets through the normal driving process of entering destination – > choose the best route – > jump navigation. Users can click the navigation to pull up the map App and realize the seamless link between the small program and the map App.
Real-time bus: Currently, only the route planning plug-in provides real-time bus capability among the products opened by Tencent Location service. Developers can help users know when the last bus arrived and how many stops it has left. Real-time bus improves the service capability of the plug-in in the field of public travel, so that users no longer “wait for the bus”.
Theme colors: Developers can change the colors of fonts, lines, buttons, and color blocks in the plugin by setting theme colors. The changed plug-in style can be perfectly integrated into the developer’s small program, so that the overall style is consistent, no longer because of the plug-in color obtrusive and reduce the user experience.
Personalized base map supports dynamic switching
Personalized base map switching ability online, can realize the use of the same subkey in the small program, through the layer-style (map official website set style style number) attribute to choose different base map style, and can dynamically switch styles. For example, use light-colored maps during the day and wechat dark-colored maps at night. As an example, the following Demo can dynamically switch the four styles: STYle1-Travel, STYle2-wechat Dark, STYle3-Danyue, and STYle4-Yulu.
Sample center applet – the best assistant for applet map development
To help applets better understand and use these map capabilities, we developed a sample applets that serve two purposes:
Display map ability: classify all map related abilities under the small program, sort out the directory structure and explain them in detail one by one; Each capability comes with a demo for developers to experience and understand.
Lower development costs: We also provide high-quality source code for each demo, and developers can jump to GitHub by clicking “View Source” on the front page. The document catalog is displayed in accordance with the structure of the sample center, which is convenient to directly copy the code for local debugging, so that developers can achieve zero cost development.
For such a close small assistant, quickly scan the code below the small program code immediately experience it!
Tencent location services will continue to polish the product, open more small program scenarios under the map ability, to provide strong support for developers. We have created a complete product capability matrix for small program developers, including service APIS, basic map components, plug-ins, industry solutions and so on. We look forward to embracing ecology and witnessing prosperity with 1.5 million + small program developers!
