How to Add Vector Features to an OpenLayers 3 Map – wikiHow

OpenLayers is a powerful JavaScript tool that enables us to create and display all sorts of maps on a website. This article will guide you in adding a point and a line string feature, then transform their projections to use coordinates, then add some colour by setting the layer's style. Please note that you need to have a working OpenLayers map installed in a webpage to follow this article. If you don't have one, see How to Make a Map Using OpenLayers 3. OpenLayers is a powerful JavaScript tool that enables us to create and display all sorts of maps on a website. This article will guide you in adding a point and a line string feature, then transform their projections to use coordinates, then add some colour by setting the layer's style. Please note that you need to have a working OpenLayers map installed in a webpage to follow this article. If you don't have one, see To tell OpenLayers where to place the point, you need to create a geometry and give it a set of coordinates, which is an array in the form of [longitude (E-W), latitude (N-S)]. The following code creates this and set's the point's geometry: Line strings are straight lines broken into segments. We create them just like points, but we provide a pair of coordinates for each point of the line string: To add the features to the map, you need to add them to a source, which you add to a vector layer, which you can then add to the map: As with any powerful mapping software, OpenLayers maps can have different layers with different ways of displaying information. Because Earth is a globe and not flat, when we try to display it on our flat maps, the software has to adjust the locations to match the flat map. These different ways to display map information are called . To use a vector layer and a tile layer together on the same map means we have to transform the layers from one projection to another. In OpenLayers, we can use the transform() function on the geometry object of each feature. Put this transform code into a function that we can call later: To change what each feature on the map looks like, we need to create and apply a style. Styles can change colours, sizes, and other attributes of points and lines, and they can also display images for each point, which is very handy for customised maps. This section isn't necessary, but it is fun and useful. Don't be afraid to use OpenLayers 3 API documentation: Although it's overwhelming at first, it's vital to learn how to do new things with OpenLayers: Source.


Яндекс.Метрика Рейтинг@Mail.ru Free Web Counter
page counter
Last Modified: April 18, 2016 @ 10:05 pm