2017-02-22 5 views
1

Я фактически создаю круги на странице в случайном порядке, и я хочу нарисовать эту функцию onclick. Но какой у меня код есть случайная функция, которая случайным образом распространяется на странице. Итак, как я могу изменить этот код на onclick?Я хочу изменить эту случайную функцию на функцию onclick

<!DOCTYPE html> 
 
<html lang='en'> 
 
<head> 
 
<html> 
 
<input type="text" name="test" style="width: 130px; height: 30px "value="" id="text" placeholder="Enter length"/> 
 
</html> 
 
    <meta charset='utf-8' /> 
 
    <script type='text/javascript' src='OpenLayers.js'></script> 
 
    <script type='text/javascript'> 
 

 
    var map; 
 
    var vector_layer; 
 
    
 
    function init() { 
 
     //Create a map with an empty array of controls 
 
     map = new OpenLayers.Map('map_element'); 
 

 
     //Create a base layer 
 
     var wms_layer = new OpenLayers.Layer.WMS(
 
      'OpenLayers WMS', 
 
      'http://vmap0.tiles.osgeo.org/wms/vmap0', 
 
      {layers: 'basic'}, 
 
      {} 
 
     ); 
 
     map.addLayer(wms_layer); 
 
     
 
     //Add vector layer 
 
     vector_layer = new OpenLayers.Layer.Vector('Settlement Vector Layer'); 
 
     map.addLayer(vector_layer); 
 

 
     var settlement_values = { 
 
      
 
      4: 'circle' 
 
     } 
 

 
     //Create some points 
 
     for(var i=0; i<20; i++){ 
 
      vector_layer.addFeatures([new OpenLayers.Feature.Vector(
 
       new OpenLayers.Geometry.Point(
 
        (Math.floor(Math.random() * 360) - 180), 
 
\t     (Math.floor(Math.random() * 180) - 90) 
 
\t   ), 
 
\t    { 
 
        'settlement_type': settlement_values[(Math.floor(Math.random() * 15))] 
 
       } 
 
      )]); 
 
     }  
 

 
     //Create a style map object 
 
     var vector_style_map = new OpenLayers.StyleMap({}); 
 
     
 
     //ADD RULES    
 
     //We need to create a 'lookup table' that contains the desired values 
 
     // and corresponding symbolizer 
 

 
     
 
       
 
var x=document.getElementById("text").value; 
 

 
    
 

 

 

 
     var symbolizers_lookup = { 
 
     
 
      'circle': { 
 
       'fillColor': '#336699','fillOpacity':.8, 'pointRadius':x, 'strokeColor': '#003366', 'strokeWidth':2 
 
      } 
 
     } 
 
     
 
     //Now, call addUniqueValueRules and pass in the symbolizer lookups 
 
     vector_style_map.addUniqueValueRules('default', 'settlement_type', symbolizers_lookup); 
 
     
 
     //Add the style map to the vector layer 
 
     vector_layer.styleMap = vector_style_map; 
 
     
 
     if(!map.getCenter()){ 
 
      map.zoomToMaxExtent(); 
 
     } 
 

 
    } 
 

 
    </script> 
 
</head> 
 

 
<body onload='init();'> 
 
    <div id='map_element' style='width: 600px; height: 600px;'></div> 
 
</body> 
 
</html>

+0

код не работает вообще. пожалуйста, дайте ссылку на рабочий пример, чтобы проверить и проверить –

+0

@Anant OpenLayers.js не существует, я думаю. – Shubham

+1

@Shubham yes Openlayer.js Не прикреплен как файл библиотеки. Я загрузил собственный код. Вы можете помочь ? –

ответ

0

Изменение onload к onclick в вашем body теге.

<body onclick='init();'> <!-- <======== HERE --> 
    <div id='map_element' style='width: 600px; height: 600px;'></div> 
</body> 
</html> 
+2

Привет, спасибо, но Onclick Он будет загружать карту. Я хочу, чтобы круги нажимали, которые выполняются случайной функцией. –

+0

Прямо сейчас, он создает 20 случайных кругов. Вы хотите, чтобы эти 20 случайных кругов создавались по клику? Или, вы хотите, чтобы 1 случайный круг нажал? – Uzbekjon

+2

Я хочу только один круг. И центр будет там, где я нажму на карту. Вы можете помочь ? –

Смежные вопросы