符号生成器

符号生成器→d3.symbol,它构造出的函数用于生成一系列符号路径字符串(path标签的d属性值)

数据格式

一个数组即可,因为它们的形状都是固定的,数组的值其实都是没用的,用的只是数组的长度,生成那么多个符号。

  1. var data = d3.range(300)

表示要生成300个符号。

构造器

最简的形式就是

  1. var symbol = d3.symbol();

但是通常我们还想控制它绘出的什么形状,以及形状的大小。d3提供了circle, cross, diamond, square, star, triangle wye等7中形状,它们是d3.symbols数组的元素。

因此我们可以构建出如下的构造器:

  1. var symbol = d3.symbol()
  2. .type(function () {return d3.symbols[~~(Math.random()*d3.symbols.length)];})
  3. .size(function (d, i) {return ~~(Math.random()*i);})

上面的构造器,我们定义的type为随机的,在这7个形状中来选择一个,大小也是随机的。然后我们就可以用这个构造器来绘制,这300个图形了:

  1. d3.select("svg").selectAll("path")
  2. .data(data).enter().append("path")
  3. .attr("transform",function (d) {
  4. return "translate("+Math.random() * 600+100+","+Math.random() * 400+100+")";})
  5. .attr("d",symbol)
  6. .attr("stroke",function(d,i){return color(i);})
  7. .attr("stroke-width",2)
  8. .attr("fill","none");

例子请移步这里

时间: 2025-01-18 09:55:02

符号生成器的相关文章

D3js-API介绍【中】

JavaScript可视化图表库D3.js API中文參考,d3.jsapi D3 库所提供的全部 API 都在 d3 命名空间下.d3 库使用语义版本号命名法(semantic versioning). 你能够用 d3.version 查看当前的版本号信息. d3 (核心部分) 选择集 d3.select - 从当前文档中选择一系列元素. d3.selectAll - 从当前文档中选择多项元素. selection.attr - 设置或获取指定属性. selection.classed - 加

【D3 API 中文手册】提交记录

[D3 API 中文手册]提交记录 声明:本文仅供学习所用,未经作者允许严禁转载和演绎 <D3 API 中文手册>是D3官方API文档的中文翻译.始于2014-3-23日,基于VisualCrew小组的六次协作任务之上,目前已经大致翻译完毕,将陆续向官网提交D3 API 中文版. 本文主要内容有: 列举初版翻译/校对人员列表 记录中文翻译的官网提交情况 提供校对联系方式 提供D3 API简版翻译 翻译/校对人员列表 翻译人员列表 API项目 文档页数 单词数 翻译 校对 core.select

记录我的第一个博客

字体修改软件 FontCreator v9.1 中文安装注册版(自动注册) 下载-... 2017年7月13日 - 字体修改软件 FontCreator v9.1 中文安装注册版(自动注册),FontCreator5.6,对于广大的字体修改爱好者来说这是一个莫大的福音,大幅降低了字体修改的入... 脚本之家 - 百度快照 怎样更改win7默认字体_百度经验 打开个性化 1 打开“窗口颜色” 2 点击“项目”里的桌面,选择“已选定的... 3 下面就可以改字体,还有字体的颜色.大小 4 显示全部

python-学习笔记之-Day5 双层装饰器 字符串格式化 python模块 递归 生成器 迭代器 序列化

1.双层装饰器 #!/usr/bin/env python # -*- coding: utf-8 -*- # author:zml LOGIN_INFO = False IS_ADMIN = False   def check_log(func): def inner(): res = func() if LOGIN_INFO: print('验证成功!') return res else: print('验证失败!') return inner   def check_admin(func)

自动化运维Python系列(四)之装饰器和生成器

装饰器 在理解什么事装饰器之前,我们需要理解:函数也是一个对象,可以赋值给变量,通过变量来调用 def f1():     print('2016') d = f1 d() 输出: 2016 那么装饰器的作用就是在不改变原函数的前提下,调用这些函数,并且为函数增加我们需要的新功能. 我们平时在编写好很多独立函数模块以后,突然需要在每个模块内添加一个功能,比如: def f1():     print('F1') def f2():     print('F2') def f3():     pr

awk:报告生成器

awk:报告生成器 格式化后显示信息 语法: awk [options] 'script' file1 file2, ... awk [options] 'PARTTERN { action }' file1 file2, ... 最常见的action:print,printf awk的基本特征: a.每一次取一行 b.根据指定的分隔符(不指定是位空白字符)将该行切割位列,使用$0(整行),$1,$2,$3...(第一列,第二列,...) c.可以指定行号,列号,切割符,操作后分隔符 案例: c

构造可配置词法语法分析器生成器(下)

本文为笔者原创,转载请注明出处 http://blog.csdn.net/xinghongduo mylex & xparser mylex & xparser是笔者实现的类似于Lex和Yacc的词法语法分析器生成器,它接受正则表达式定义的词法规则和BNF定义的语法规则,自动构造对应的以C为宿主语言的词法分析器源程序mylex.h, mylex.c和语法分析器源程序xparser.h, xparser.c. mylex & xparser特点如下: 轻量无依赖:构造器的主要代码仅2

介绍一款原创的四则运算算式生成器:CalculateIt2

家里小朋友读一年级了,最近每天都有一些10以内的加减法口算练习,作为程序员爸爸,自然也是想办法能够偷懒,让电脑出题,给小朋友做些练习.于是,自己在业余时间开发了一个四则运算算式生成器,名为:CalculateIt2.项目是开源的,源码地址是:https://github.com/daxnet/CalculateIt2.也可以在标准的.NET Framework 4.6.1的项目中,通过nuget来引用这个类库,nuget ID是:CalculateIt2.Engine.为什么名字后面有一个"2&

Python自动化运维之7、格式化输出、生成器、迭代器、列表解析、迭代器表达式

Python格式化输出: Python的字符串格式化有两种方式: 百分号方式.format方式 百分号的方式相对来说比较老,而format方式则是比较先进的方式,企图替换古老的方式,目前两者并存.[PEP-3101] (1)百分号格式化 %[(name)][flags][width][.precision]typecode .... (name) 可选,用于选择指定的key flags 可选,可供选择的值有: + 右对齐:正数前加正好,负数前加负号: - 左对齐:正数前无符号,负数前加负号: 空