brython and openlayer3

[jean claude meilland]

hi

I'm currently testing brython. I want to create a html page with brython and openlayer3.

Currently I use this link but is what you have an example to use brython and openlayer3 for a simple map.
I try to convert  the first exemple for brython: https://openlayers.org/en/latest/doc/quickstart.html

thancks
(excuse me for my bad english)

[Kiko]

2017-06-07 15:36 GMT+02:00 jean claude meilland <meill...@gmail.com>:

hi

I'm currently testing brython. I want to create a html page with brython and openlayer3.

Currently I use this link but is what you have an example to use brython and openlayer3 for a simple map.
I try to convert  the first exemple for brython: https://openlayers.org/en/latest/doc/quickstart.html

Hi, Jean Claude,

Here you have an example I did some time ago using openlayers2:
https://github.com/kikocorreoso/map2wiki/blob/master/src/templates/index.html

Here you have even a step by step tutorial using OpenLayers2:
https://github.com/kikocorreoso/brythonmagic/blob/master/notebooks/OpenLayers%20(python)%20tutorial.ipynb

Adapt the examples to openlayers3 should be quite easy.

 

thancks
(excuse me for my bad english)

--
You received this message because you are subscribed to the Google Groups "brython" group.
To unsubscribe from this group and stop receiving emails from it, send an email to brython+unsubscribe@googlegroups.com.
To post to this group, send email to bry...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/brython/dfc89a14-515b-46d1-8d16-af8472869dfb%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Kiko]

2017-06-07 18:53 GMT+02:00 Kiko <kikoco...@gmail.com>:

2017-06-07 15:36 GMT+02:00 jean claude meilland <meill...@gmail.com>:

hi

I'm currently testing brython. I want to create a html page with brython and openlayer3.

Currently I use this link but is what you have an example to use brython and openlayer3 for a simple map.
I try to convert  the first exemple for brython: https://openlayers.org/en/latest/doc/quickstart.html

Hi, Jean Claude,

Here you have an example I did some time ago using openlayers2:
https://github.com/kikocorreoso/map2wiki/blob/master/src/templates/index.html

Here you have even a step by step tutorial using OpenLayers2:
https://github.com/kikocorreoso/brythonmagic/blob/master/notebooks/OpenLayers%20(python)%20tutorial.ipynb

Adapt the examples to openlayers3 should be quite easy.

Ok, here you have a small example using ol3:
http://jsfiddle.net/zo2La83r/

It is the brython version of the quick start example here: http://openlayers.org/en/latest/doc/quickstart.html

I hope it helps.

[jean claude meilland]

Thank you very much kiko, I will look at this.

Le mercredi 7 juin 2017 19:08:19 UTC+2, kiko (on pybonacci) a écrit :

2017-06-07 18:53 GMT+02:00 Kiko <kikoco...@gmail.com>:

2017-06-07 15:36 GMT+02:00 jean claude meilland <meill...@gmail.com>:

hi

I'm currently testing brython. I want to create a html page with brython and openlayer3.

Currently I use this link but is what you have an example to use brython and openlayer3 for a simple map.
I try to convert  the first exemple for brython: https://openlayers.org/en/latest/doc/quickstart.html

Hi, Jean Claude,

Here you have an example I did some time ago using openlayers2:
https://github.com/kikocorreoso/map2wiki/blob/master/src/templates/index.html

Here you have even a step by step tutorial using OpenLayers2:
https://github.com/kikocorreoso/brythonmagic/blob/master/notebooks/OpenLayers%20(python)%20tutorial.ipynb

Adapt the examples to openlayers3 should be quite easy.

Ok, here you have a small example using ol3:
http://jsfiddle.net/zo2La83r/

It is the brython version of the quick start example here: http://openlayers.org/en/latest/doc/quickstart.html

I hope it helps.

 

thancks
(excuse me for my bad english)

--
You received this message because you are subscribed to the Google Groups "brython" group.

To unsubscribe from this group and stop receiving emails from it, send an email to brython+u...@googlegroups.com.

[jean claude meilland]

http://jsfiddle.net/zo2La83r/

This is exactly what I was looking for.
thanks again

[jean claude meilland]

[jean claude meilland]

Here are some feedback.
To convert a javascript map to brython map with OpenLayer I use:

• Add after the <script> tag
  import window
  ol = window.ol
• Remove keyword var
• Put the keyword new at the end
  For example we transform
  var map = new ol.Map ({ 
  in
  map = ol.Map.new(
  
• Edit to have a python dictionary
  target: 'map' is replaced by 'target': 'map'
• remove getElemenById() replace true with True or false with False etc ....

I use with vim two expression list:

• '<,'>s/^\(.*\)new\([^(]*\)/\1\2\.new/
• '<,'>s/^ *\([^:][^:]*\):/'\1':/g

I have several questions but I will ask them on another thread.

Le mercredi 7 juin 2017 15:36:45 UTC+2, jean claude meilland a écrit :

[Kiko]

2017-06-13 8:36 GMT+02:00 jean claude meilland <meill...@gmail.com>:

Here are some feedback.
To convert a javascript map to brython map with OpenLayer I use:

• Add after the <script> tag
  import window
  ol = window.ol
• Remove keyword var
• Put the keyword new at the end
  For example we transform
  var map = new ol.Map ({ 
  in
  map = ol.Map.new(
  
• Edit to have a python dictionary
  target: 'map' is replaced by 'target': 'map'
• remove getElemenById() replace true with True or false with False etc ....

It is quite similar in this case but when you have to apply some logics to the script (loops, conditionals,...) you can use a more pythonic interface \o/

 

I use with vim two expression list:

• '<,'>s/^\(.*\)new\([^(]*\)/\1\2\.new/
• '<,'>s/^ *\([^:][^:]*\):/'\1':/g

I have several questions but I will ask them on another thread.

Le mercredi 7 juin 2017 15:36:45 UTC+2, jean claude meilland a écrit :

hi

I'm currently testing brython. I want to create a html page with brython and openlayer3.

Currently I use this link but is what you have an example to use brython and openlayer3 for a simple map.
I try to convert  the first exemple for brython: https://openlayers.org/en/latest/doc/quickstart.html

thancks
(excuse me for my bad english)

--

You received this message because you are subscribed to the Google Groups "brython" group.

To unsubscribe from this group and stop receiving emails from it, send an email to brython+unsubscribe@googlegroups.com.

To post to this group, send email to bry...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/brython/4ba76c1f-5d6c-4f71-ab22-c0db01a2baff%40googlegroups.com.

[jean claude meilland]

Le mardi 13 juin 2017 08:43:08 UTC+2, kiko (on pybonacci) a écrit :

It is quite similar in this case but when you have to apply some logics to the script (loops, conditionals,...) you can use a more pythonic interface \o/

You are right.
I discovered brython.
For example I have a problem to convert this example: https://openlayers.org/workshop/fr/layers/vector.html

How convert this function for brython?:

map.on('singleclick', function(e) {
 var feature = map.forEachFeatureAtPixel(e.pixel, function(feature) {
 return feature;
 });
 var infoElement = document.getElementById('info');
 infoElement.innerHTML = feature ? feature.get('title') : '';
});

Is fonction Lamda?

Here is my example:

<html>  
<head>  
<meta charset="utf-8" />  
<script type="text/javascript" src="https://www.brython.info/src/brython.js"></script>  
<script type="text/javascript" src="https://openlayers.org/en/v4.1.1/build/ol.js"></script>  
<link rel="stylesheet" type="text/css" href="https://openlayers.org/en/v4.1.1/css/ol.css">  
<style>  
#map {  
height: 400px;  
width: 100%;  
}  
.ol-attribution a {  
color: black;  
}  
</style>  
</head>  
<body onload="brython(1)">  
<div id="map" class ="map"> </div>  
 
<div id="info"></div>  
 
<script type="text/python">  
from browser import window, document  
ol = window.ol  
 
tremblement_terre=  ol.layer.Vector.new({  
      'title': 'Earthquakes',  
      'source':  ol.source.Vector.new({  
        'url': 'https://raw.githubusercontent.com/boundlessgeo/ol3-workshop/master/src/data/layers/7day-M2.5.json',  
        'format':  ol.format.GeoJSON.new()  
      }),  
      'style':  ol.style.Style.new({  
        'image':  ol.style.Circle.new({  
          'radius': 3,  
          'fill':  ol.style.Fill.new({'color': 'white'})  
        })  
     })  
  })  
 
map =  ol.Map.new({  
  'target': 'map',  
  'layers': [  
    ol.layer.Tile.new({  
      'title': 'Global Imagery',  
      'source':  ol.source.TileWMS.new({  
        'url': 'https://ahocevar.com/geoserver/wms',  
        'params': {'LAYERS': 'nasa:bluemarble', 'TILED': True}  
      })  
    }),  
tremblement_terre  
  ],  
  'view':  ol.View.new({  
    'projection': 'EPSG:4326',  
    'center': [5.7626, 45.1734],  
    'zoom': 1,  
    'maxResolution': 0.703125  
})  
})  


def info(ev):  
  document["info"] <= "{} {}  ".format(ev.x,ev.y)  
  ???????????????????????????????
 
   
document["map"].bind('click',info)  
</script>  
</body>  
</html>

thanks

[Kiko]

This is close: http://jsfiddle.net/4nnyr3r1/

Check the latests lines

But there is a problem with the feature object (ft in my example) that should be returned by the lambda function.

Maybe Pierre can provide more info on this.

If I try to use ft.get('title') it raises an error.

The object returned by the lambda is not a 'real' Feature object and I don't know how to debug this.

 

--
You received this message because you are subscribed to the Google Groups "brython" group.
To unsubscribe from this group and stop receiving emails from it, send an email to brython+unsubscribe@googlegroups.com.
To post to this group, send email to bry...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/brython/1e28c541-289e-4c19-acfc-14773fc84073%40googlegroups.com.

[jean claude meilland]

Thanks again for your help
The function below works fine.

def get_feature(e):  
    ft = map.forEachFeatureAtPixel(e.pixel, lambda feature, layer: feature)  
    info_element = document['info']  
    #info_element.text = ft.getKeys()  
    try:  
        info_element.text = ft.get('title')  
    except:  
        pass  
map.on('singleclick', get_feature)  

To unsubscribe from this group and stop receiving emails from it, send an email to brython+u...@googlegroups.com.

To post to this group, send email to bry...@googlegroups.com.

[kikocorreoso]

On 13/06/17 17:31, jean claude meilland wrote:

Thanks again for your help
The function below works fine.

def get_feature(e):  
    ft = map.forEachFeatureAtPixel(e.pixel, lambda feature, layer: feature)  
    info_element = document['info']  
    #info_element.text = ft.getKeys()  
    try:  
        info_element.text = ft.get('title')  
    except:  
        pass  
map.on('singleclick', get_feature)  

So I was doing something weird with the ft object ¿?

Happy to see it working. Could you share the complete example so there is a record of it in the ML?

Thanks.

To view this discussion on the web visit https://groups.google.com/d/msgid/brython/1da07222-6ad9-46fd-a5b6-080cc16b0520%40googlegroups.com.

[jean claude meilland]

Le mardi 13 juin 2017 17:34:08 UTC+2, kiko (on pybonacci) a écrit :

  Could you share the complete example so there is a record of it in the ML?

I hope I have understood what you are asking for.

http://jsfiddle.net/debimax/4nnyr3r1/2/

or code of file.html?

 
 
 
def get_feature(e):    
    ft = map.forEachFeatureAtPixel(e.pixel, lambda feature, layer: feature)  
    info_element = document['info']  
    #info_element.text = ft.getKeys()  
    try:  
        info_element.text = ft.get('title')  
    except:  
        info_element.text = ""  
 
map.on('singleclick', get_feature)  
</script>  
</body>  
</html>  

Saisissez le code ici...

[kikocorreoso]

On 13/06/17 17:57, jean claude meilland wrote:

Le mardi 13 juin 2017 17:34:08 UTC+2, kiko (on pybonacci) a écrit :

  Could you share the complete example so there is a record of it in the ML?

I hope I have understood what you are asking for.

That's it, a working example so others can find it in the ML (MailList).
Thanks!!!

--
You received this message because you are subscribed to the Google Groups "brython" group.
To unsubscribe from this group and stop receiving emails from it, send an email to brython+u...@googlegroups.com.
To post to this group, send email to bry...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/brython/c3b83d21-275e-4462-9a0a-2be68417039e%40googlegroups.com.