Advertisement
Guest User

Untitled

a guest
Mar 23rd, 2017
73
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.16 KB | None | 0 0
  1. //this function helps to avoid redrawing svg after map movement
  2. //it has to be called after 'map.getPixelFromCoordinate' gets available
  3. //returns scaleLonLat(lonlat) function that returns [x_px, y_px] for usage with d3
  4. //prevent lines thickness from getting scaled through css: .map .d3-layer path { vector-effect: non-scaling-stroke; }
  5. //usage example:
  6. //var s
  7. //map.once('precompose', ()=>{ s=init_ol_d3(this); draw(); })
  8. //var draw_route = d3.line().x((lonlat)=>{return s(lonlat)[0]}).y(...
  9.  
  10. //TODO: postrender event is called for each tile render
  11. //TODO: scale function has to be called twice (for d3.line().x and for d3.line().y)
  12.  
  13. function init_ol_d3(map) {
  14. d3.selectAll('#'+map.getTarget() + ' .d3-layer').remove()
  15. var g = d3.select('#'+map.getTarget() + ' .ol-viewport')
  16. .insert('div', 'canvas').classed('d3-layer', true) //div before gui for gui to work
  17. .style('position', 'absolute')
  18. .style('bottom', '0px')
  19. .style('left', '0px')
  20. .style('width', '100%')
  21. .style('height', '100%')
  22. .append('svg')
  23. .style('width', '100%')
  24. .style('height', '100%')
  25. .append('g')
  26. var init00 = map.getPixelFromCoordinate(ol.proj.fromLonLat([0, 0]))
  27. var init11 = map.getPixelFromCoordinate(ol.proj.fromLonLat([1, 1]))
  28. var initScale = [init11[0]-init00[0], init11[1]-init00[1]]
  29. var curr00 = init00
  30. var rescale = [1, 1]
  31.  
  32. map.on('postrender', function() { //retransform
  33. curr00 = map.getPixelFromCoordinate(ol.proj.fromLonLat([0, 0]))
  34. var curr11 = map.getPixelFromCoordinate(ol.proj.fromLonLat([1, 1]))
  35. var currScale = [curr11[0]-curr00[0], curr11[1]-curr00[1]]
  36. rescale = [currScale[0]/initScale[0], currScale[1]/initScale[1]]
  37. var retranslate = [curr00[0]-init00[0]*rescale[0], curr00[1]-init00[1]*rescale[1]]
  38. g.attr("transform", //p_curr = (p_init-O_init)*rescale + O_curr
  39. "translate(" + retranslate[0] + "," + retranslate[1] + ")" +
  40. " scale(" + rescale[0] + "," + rescale[1] + ")");
  41. })
  42.  
  43. scaleLonLat = function(lonlat) { //p_init = (p_curr-O_curr)/rescale + O_init
  44. var p = map.getPixelFromCoordinate(ol.proj.fromLonLat(lonlat))
  45. p[0] = (p[0] - curr00[0])/rescale[0] + init00[0]
  46. p[1] = (p[1] - curr00[1])/rescale[1] + init00[1]
  47. return p
  48. }
  49. return scaleLonLat
  50. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement