Inside the KML Placemark
Projects
Written by Mike James   
Tuesday, 05 October 2010
Article Index
Inside the KML Placemark
LinearRing
Style
3D concerns
More than one geometry
Polygon generator in Javascript

Banner

An example

As an example the following draws two rectangles one in green and one in red:

<Document>
<Style id="green">
<LineStyle>
<color>ff00ff00</color>
<width>5</width>
</LineStyle>
</Style>  
<Style id="red">
<LineStyle>
<color>ff0000ff</color>
<width>5</width>
</LineStyle>
</Style>
<Placemark>
<styleUrl>#red</styleUrl>
<LinearRing>
<coordinates>
0.0,0.0,0.0
1.0,5.0,0.0
5.0,5.0,0.0
5.0,0.0,0.0
0.0,0.0,0.0
</coordinates>    
</LinearRing>
</Placemark>
<Placemark>
<styleUrl>#green</styleUrl>
<LinearRing>
<coordinates>
0.0,6.0,0.0
1.0,15.0,0.0
5.0,15.0,0.0
5.0,6.0,0.0
0.0,6.0,0.0
</coordinates>    
</LinearRing>
</Placemark>
</Document>

Notice that now as we have two Placemarks we have to bundle them up into a single ??Document.

 

redgreen

 

A Polygon generator in Javascript

One of the uses of geometric objects is to create a custom place marker without the need to use a custom bitmap icon. To do this you generally need to generate the KML using a script.

For example to generate an n-sided polygon of radius r and centered on x,y you might use:

function polygon(x,y,r,n){
var inc=2*Math.PI/n;
var KML=x.toString()+","+
(r+y).toString()+",0.0\n";
for (var i = 1; i <n; i++){
KML=KML +
(r*Math.sin(i*inc)+x).toString() +
   "," +
(r*Math.cos(i*inc)+y).toString()+
",0.0\n";
};

As this only generates the necessary co-ordinates you have to embed it in sutiable KML tags.

For example:

alert(polygon(-1,55,1,3));

generates the co-ordinates for a triangle centered on -1,55 and radius 1.

These can be copied and pasted into the co-ordinate section of a polygon to give:

<Placemark>  
<Style>
<LineStyle>
<color>ff0000ff</color>
<width>5</width>
</LineStyle>
<PolyStyle>
<color>ff0000ff</color>
</PolyStyle>
</Style>
<Polygon>
<outerBoundaryIs>
<LinearRing>
<coordinates>
-1,56,0.0
-0.1339745962155613,54.5,0.0
-1.8660254037844383,54.5,0.0
-1,56,0.0
</coordinates>    
</LinearRing>
</outerBoundaryIs>
</Polygon>
</Placemark>

triangle1

 

You can create any polygon marker in the same way and even approximate a circle if you set n big enough. For example, n=25

circle

 

The reason the "circle" is in fact an ellipse is that we are working with latitude and longitude as if they were measures of linear distance. How much distance a degree of longitude represents depends on the latitude. To make this shape generator position-independent you need to scale the latitude and longitude so that you are working in ground distances - not difficult but something for another article.

 

If you would like to be informed about new articles on I Programmer you can either follow us on Twitter, on Facebook , on Digg or you can subscribe to our weekly newsletter.

Banner


Gmail, Spreadsheets and Google App Script

If you have to administer an email list, creating a Google App Script to process email bounces and send the relevant data to a spreadsheet is not only useful but also a good example of using scripts.

 [ ... ]



Getting Started With Azure Linux VMs

If you are a Visual Studio user there are lots of advantages to making use of Azure as your Virtual Machine host. In this article the general ideas of using Azure and how to work with Linux VMs is des [ ... ]


Other Projects

<ASIN:0470095288>

<ASIN:0321525590>

<ASIN:0471790095>

<ASIN:0470381248>

<ASIN:1430216204>

<ASIN:1419689037>

<ASIN:0596101619>



Last Updated ( Tuesday, 05 October 2010 )
 
 

   
RSS feed of all content
I Programmer - full contents
Copyright © 2014 i-programmer.info. All Rights Reserved.
Joomla! is Free Software released under the GNU/GPL License.