Back

d3 - zoom 缩放和 整体移动(鼠标左键点击是移动,滚轮是缩放)

发布时间: 2021-05-07 23:28:00

地图缩放看这个  https://bl.ocks.org/d3noob/3fb4abdf99035adc8dfc3b3a823f8ae9

代码:  d3 v6 的版本

         // 缩放
         let zoom = d3.zoom()
           .scaleExtent([1,8])
           .on('zoom', function(event){
             svg.attr('transform', event.transform)
           })

下面这个是 d3 v4的zoom用法(跟上面几乎一样,就是event的参数略有不同,跟v6不一样)

https://www.d3-graph-gallery.com/graph/interactivity_zoom.html

地图,点击之后选择省份 

https://observablehq.com/@d3/zoom-to-bounding-box?collection=@d3/d3-zoom

Back