[OpenLayers-Users] Add Point to Map

Alexandre Dube adube at mapgears.com
Fri Nov 13 11:58:44 EST 2009


Christopher,

Jones, Christopher wrote:
>
> Hi
>
> Thanks for the tips!  Its not quite what I was looking for unfortunately.  I need the ability to add a point to be connected to a button I have on the web page rather than a specific OpenLayers Vector control.
>   

How about this [1] ( still an OpenLayers approach, but outside the map... )?

Kind regards,

Alexandre

[1] http://openlayers.org/dev/examples/navtoolbar-outsidemap.html

> I have added the HTML element to hopefully help describe what I am trying to achieve.
>
> Thanks again
>
> Chris
>
>
>
> <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
>
> <html xmlns="http://www.w3.org/1999/xhtml">
>
> <head>
>   <title>OpenLayers </title>
>     <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAA-G5pfbkze92iVXWIhk7eJxRqZzHA8hAfFngd-nr1bRnZnyrphBR_DAMWurr6RFvtr6noMigi_EMbsw"type="text/javascript"></script>
>     <script src="http://openlayers.org/api/OpenLayers.js" type="text/javascript"></script>
>     <script src="JScript.js" type="text/javascript"></script>
>     <style type="text/css">
>         #Button1
>         {
>             width: 83px;
>         }
>         #Button2
>         {
>             width: 81px;
>             margin-left: 9px;
>         }
>         #Button3
>         {
>             width: 80px;
>             margin-left: 9px;
>         }
>         #Button4
>         {
>             width: 82px;
>             height: 21px;
>         }
>         #Button5
>         {
>             width: 82px;
>             margin-left: 710px;
>             margin-top: 0px;
>             margin-bottom: 0px;
>         }
>     </style>
>     
>
>     <script language="javascript" type="text/javascript">
> // <!CDATA[
>
>
> // ]]>
>     </script>
> </head>
> <body onload="initialiseMap()" bgcolor="#6699ff">
>         
>     <p>
>         <input id="Button1" type="button" onclick=" singleClickButton ()" value="Single Click" />
>     </p>
>         
>     <div style="height: 563px; width: 1063px; margin-top: 0px;" id="map">
>     </div>
>
>     </body>
> </html>
>
>
> -----Original Message-----
> From: users-bounces at openlayers.org [mailto:users-bounces at openlayers.org] On Behalf Of Alexandre Dube
> Sent: 13 November 2009 14:04
> To: Jones, Christopher
> Cc: users at openlayers.org
> Subject: Re: [OpenLayers-Users] Add Point to Map
>
> Christopher,
>
>   Look at the following example [1].  It should helps you a lot.  (click 
> on the small pencil to add a point).
>
>   See also this article [2] about spherical mercator.
>
> Kind regards,
>
> Alexandre
>
> [1] http://openlayers.org/dev/examples/spherical-mercator.html
> [2] http://docs.openlayers.org/library/spherical_mercator.html
>
> Jones, Christopher wrote:
>   
>> Hi all,
>>
>>  
>>
>> Im fairly new to OpenLayers and  javascript for that matter as well.  
>> Having looked extensively through all the various examples and forums 
>> and blogs, and one or 2 tutorials, I am still struggling to add a 
>> point to a map (or a vector layer)!  All I want, is to click on a map 
>> and adda a point.  Heres my code, please feel free to point all the 
>> errors you want!
>>
>>  
>>
>> Thanks in advance!
>>
>>  
>>
>> Chris
>>
>> (Sorry if this has been sent twice)
>>
>>  
>>
>>  
>>
>> var myStyles = new OpenLayers.StyleMap({
>>
>>     "default": new OpenLayers.Style({
>>
>>         fillColor: "#ffcc66",
>>
>>         strokeColor: "#ff9933",
>>
>>         strokeWidth: 10
>>
>>     })
>>
>> });
>>
>>  
>>
>> function initialiseMap(){
>>
>>         map = new OpenLayers.Map('map');
>>
>>         map.addControl(new OpenLayers.Control.LayerSwitcher());
>>
>>         var gphy = new OpenLayers.Layer.Google(
>>
>>                 "Google Physical",
>>
>>                 { type: G_PHYSICAL_MAP }
>>
>>             );
>>
>>         var gmap = new OpenLayers.Layer.Google(
>>
>>                 "Google Streets",
>>
>>                 {numZoomLevels: 20 }
>>
>>             );
>>
>>         var ghyb = new OpenLayers.Layer.Google(
>>
>>                 "Google Hybrid",
>>
>>                 { type: G_HYBRID_MAP, numZoomLevels: 20 }
>>
>>             );
>>
>>         var gsat = new OpenLayers.Layer.Google(
>>
>>                 "Google Satellite",
>>
>>                 { type: G_SATELLITE_MAP, numZoomLevels: 20 }
>>
>>             );
>>
>>                 map.addLayers([gphy, gmap, ghyb, gsat]);
>>
>>                 map.setCenter(new OpenLayers.LonLat(-74.0094, 
>> 40.7048), 5);
>>
>>                 map.addControl(new OpenLayers.Control.PanZoomBar());
>>
>>                 map.addControl(new OpenLayers.Control.MousePosition());
>>
>> }
>>
>>  
>>
>>  
>>
>>  
>>
>> function singleClickButton() {
>>
>>     document.getElementById("map").childNodes[0].style.cursor = 
>> "crosshair";
>>
>>     map.events.register('click', '', singleClickEvent);
>>
>>  
>>
>> }
>>
>>  
>>
>> function singleClickEvent (e) {
>>
>>     var lonlat = map.getLonLatFromViewPortPx(e.xy);
>>
>>     var lon = lonlat.lon
>>
>>     var lat = lonlat.lat
>>
>>  
>>
>>     var pointLayer = new OpenLayers.Layer.Vector('Points', { styleMap: 
>> myStyles });
>>
>>     map.addLayers([pointLayer]);
>>
>>     var bPoint = new OpenLayers.Geometry.Point(lon , lat)
>>
>>     newpoint = new OpenLayers.Feature.Vector(bPoint);
>>
>>     pointLayer.addFeatures(newpoint);
>>
>>    
>>
>> }
>>
>>  
>>
>>  
>>
>>  
>>
>>  
>>
>>  
>>
>>  
>>
>> IMPORTANT - This email and the information that it contains may be 
>> confidential, legally privileged and protected by law. Access by the 
>> intended recipient only is authorised. Any liability (in negligence or 
>> otherwise) arising from any third party acting, or refraining from 
>> acting, on any information contained in this email is hereby excluded. 
>> If you are not the intended recipient, please notify 
>> AmlinCommunications at amlin.co.uk immediately then delete it and do not 
>> disclose the contents to any other person, use it for any purpose or 
>> store or copy the information in any medium.
>>
>> Copyright in this email and attachments created by us belong to Amlin 
>> plc and/or one or more of its subsidiaries (Amlin Group). The author 
>> also asserts the right to be identified as such and object to any misuse.
>>
>> The Amlin Group prohibits and takes steps to prevent its email systems 
>> from being used to view, store or transmit offensive, obscene or 
>> discriminatory material. If this message contains inappropriate 
>> material please report it immediately to AmlinCommunications at amlin.co.uk.
>>
>> The Amlin Group records, monitors and may inspect messages that use 
>> its telecoms systems in order to protect its information, interests 
>> and reputation. Any message sent by you to or within the Amlin Group 
>> may therefore be viewed and may be acted upon.
>>
>> Of the companies within the Amlin Group, Amlin Underwriting Limited, 
>> Amlin Underwriting Services Limited, Amlin UK Limited and Amlin Plus 
>> Limited are authorised and regulated by the Financial Services Authority.
>>
>> This email has been sent by a member of staff of one or more of the 
>> following Amlin Group companies:
>>
>> Amlin plc. Registered in England and Wales no. 2854310
>> Amlin Underwriting Limited. Registered in England and Wales no. 2323018
>> Amlin Underwriting Services Limited. Registered in England and Wales 
>> no. 422615
>> Amlin UK Limited. Registered in England and Wales no. 2739220
>> Amlin Plus Limited. Registered in England and Wales no. 4729659
>>
>> Registered Offices: St Helen's, 1 Undershaft, London EC3A 8ND, United 
>> Kingdom
>>
>> Amlin plc switchboard: 020 7746 1000
>> Web Site: http://www.amlin.com
>>
>> ------------------------------------------------------------------------
>>
>> _______________________________________________
>> Users mailing list
>> Users at openlayers.org
>> http://openlayers.org/mailman/listinfo/users
>>   
>>     
>
>
>   


-- 
Alexandre Dubé
Mapgears
www.mapgears.com




More information about the Users mailing list