d3.js——图形缩放平移操作
来源:互联网 发布:朗逸销量高的原因知乎 编辑:程序博客网 时间:2024/05/01 19:14
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>缩放操作</title></head><body><script src = "d3.js"></script><script> var width = 400, height = 400; var circles =[{cx:150,cy:200,r:30}, {cx:250,cy:200,r:30}] var svg = d3.select("body").append("svg") .attr("width",width) .attr("height",height) //定义缩放函数 var zoom = d3.behavior.zoom() .scaleExtent([1,10])//用于设置最小和最大的缩放比例 .on("zoom",zoomed) //绘制 var g = svg.append("g") .call(zoom) g.selectAll("circle") .data(circles) .enter() .append("circle") .attr("cx", function (d) { return d.cx }) .attr("cy", function (d) { return d.cy }) .attr("r", function (d) { return d.r }) .attr("fill","black") function zoomed(){ g.attr("transform","translate("+d3.event.translate+")scale("+d3.event.scale+")") } //d3.event.translate 是平移的坐标值,d3.event.scale 是缩放的值。</script></body></html>
0 0
- d3.js——图形缩放平移操作
- d3.js 实现svg 缩放 平移 旋转
- d3.js——图形拖拽操作
- OpenGL入门示例8——图形平移、旋转、缩放
- perl-opengl基本图形操作-缩放,二维旋转,二维平移
- iOS 图形上下文的矩阵操作(平移、旋转、缩放)
- hammer.js操作svg使达到平移,缩放
- 矩阵运算——平移,旋转,缩放
- 矩阵运算——平移,旋转,缩放
- 矩阵运算——平移,旋转,缩放
- 矩阵运算——平移,旋转,缩放
- 七 iOS之 矩阵操作(图形上下文的平移、缩放、旋转)
- 【 D3.js 进阶系列 — 6.1 】 缩放的应用(Zoom)
- ios-day14-03(Quartz 2D之矩阵操作——旋转、平移、缩放)
- d3.js-svg图形基础
- D3.js中初始化缩放比例
- 测试程序:平移缩放旋转操作
- Qwt中的鼠标操作之缩放、平移
- Android 中自定义控件总结
- 深入mysql "ON DUPLICATE KEY UPDATE" 语法的分析
- DHCP通信原理详解
- KVM扩容磁盘
- sap abap中动态指定查询条件
- d3.js——图形缩放平移操作
- HttpUrlconnection get请求数据
- 机器学习相关——协同过滤
- 谁的Promise?
- 有序无序列表样式设置
- @Transactional事务回滚
- 青山老农PK三只松鼠:“淘品牌”烧流量梦碎,社群电商步入验证大年
- iOS 开发之JS与Native交互
- Json返回递归异常