交互式数据可视化-D3.js(五)过渡

2018-11-04
阅读 1 分钟
1.7k
过渡效果的起始状态和目标状态都很明确,指定之后元素会从起始状态过渡为目标状态。初始化一个过渡效果,有如下几个方法:var tran = d3.transition() - 创建一个过渡对象

交互式数据可视化-D3.js(四)形状生成器

2018-11-04
阅读 3 分钟
2.8k
linePath.x() - 如果指定了 x 则将 x 访问器设置为指定的函数或数值并返回当前 line 生成器。如果没有指定 x 则返回当前 x 访问器,默认为:

交互式数据可视化-D3.js(三)比例尺

2018-11-03
阅读 3 分钟
2.2k
线性比例尺 线性比例尺是常用比例尺常用方法有: var linear = d3.scaleLinear() - 创建一个定量的线性比例尺. linear.domain([numbers]) - 定义或获取定义域 linear.range([values]) - 定义或获取值域 linear(x) - 输入一个定义域内的值,返回一个值域的值 linear.invert(y) - 输入一个值域的值,返回一个定义域的值 li...

交互式数据可视化-D3.js(二)选择集和数据

2018-11-03
阅读 2 分钟
3k
选择集 select和selectAll类似jquery: {代码...} 操作选择集 查看状态 判断选择集是否为空: {代码...} 返回第一个选择集: {代码...} 返回选择集的长度: {代码...} 设定和获取 {代码...} 设置或获取选择集的属性name是属性名称,value是属性值,省略value则返回属性值有部分属性不能通过attr获取或设置则使用: {代码...

交互式数据可视化-D3.js(一)

2016-08-30
阅读 3 分钟
4.3k
可缩放矢量图(scalabel vector graphics),是用于描述二维矢量图形的一种图形格式,是由W3C制订的开放标准。SVG使用XML格式来定义图形,IE8版本以后的浏览器绝大部份都支持SVG。

GoJS 绘图 (十) :链接(完结)

2016-08-01
阅读 2 分钟
6.9k
许多节点都需要用指示的方向性。 GoJS可以很容易地建立方向,只需添加一个形状并设置其Shape.toArrow属性。当然你也可以设置其它形状的属性,如Shape.fill以自定义箭头的外观。

GoJS 绘图 (九) :数据绑定

2016-06-14
阅读 3 分钟
7.6k
绑定GraphObject数据的属性。在这个例子中,我们不仅绑定TextBlock.text和Shape.fill中的节点到节点数据的属性值,对于线条我们也结合Shape.stroke和Shape.strokeWidth中的数据的属性值。

GoJS 绘图 (八) :模型和模版

2016-06-06
阅读 2 分钟
4.9k
事实上,图已经为节点和链接非常简单的默认模板。如果您想自定义您的图表中的节点的外观,你可以通过设置替换默认节点模板Diagram.nodeTemplate。让我们创建一个图表,提供必要信息。该特定节点的数据已投入JavaScript对象的数组。我们声明在链路的数据对象一个​​单独的数组链接关系。每个链路数据,通过使用他们的密钥...

GoJS 绘图 (七) :表面板(tablePanel)

2016-06-03
阅读 5 分钟
4.2k
表板中的每个对象被放入由的值索引的GraphObject.row和GraphObject.column。面板会看行和列的所有在面板中的对象,以确定该表应多少行和列。

GoJS 绘图 (六) :横向面板(panel)

2016-06-02
阅读 2 分钟
4.2k
垂直和水平两个面板的支持的Panel.defaultAlignment和Panel.defaultStretch属性。这是一种便捷的方式使您不必设置每个元件的GraphObject.alignment或GraphObject.stretch

GoJS 绘图 (五) :定位面板与垂直面板(Panel)

2016-05-31
阅读 3 分钟
7.8k
Panel是负责任的大小和位置的所有元素。每个面板建立自己的坐标系。一个面板的元件的绘制顺序表示建立这些元素的Z轴排序。虽然只有一个面板,也有许多不同类型的面板,每个都有其自己的目的是如何安排的元素。当你建立一个面板,你通常会指定其Panel.type作为构造函数参数。这些都是存在的各种面板组成:

GoJS 绘图 (四) :构建节点与GraphObjects

2016-05-26
阅读 2 分钟
6.5k
你可以构建一个节点或其类型的JavaScript代码。以下将讨论基本类型,你可以用它来建立一个节点对象。这些页面通过明确创建和添加节点和链路建立的示意图。以下页面将展示如何使用模型,而不是使用这些代码来构建图表。

GoJS 绘图 (三) :shapes

2016-05-26
阅读 2 分钟
6.1k
绘制一个几何图形。您可以控制什么样的形状绘制以及它是如何绘画和填充。形状不像的TextBlocks和Pictures,形状不能包含任何其他对象。

GoJS 绘图 (二) :TextBlocks

2016-05-24
阅读 5 分钟
10.3k
大小和文本的外观风格被指定TextBlock.font。值可以是任何CSS字体符串。文本颜色使用TextBlock.stroke。值可以是任何的CSS颜色字符串。默认情况下,颜色为“黑”。您也可以指定背景:GraphObject.background。默认为无颜色,这会导致一个透明背景。背景总是矩形。这些简单的演示,创建了文本块,并将其添加到图中

GoJS 绘图 (一) :入门

2016-05-23
阅读 1 分钟
9.7k
GoJS是一个JavaScript库,让你轻松创建现代Web浏览器的交互图。 GoJS支持图形化的模板和图形对象属性数据模型的数据绑定。你只需要保存和恢复模型,包括持有任何性质的应用需求,简单的JavaScript对象。许多预定义的工具和命令执行,大部分的图表所需要的标准的行为。外观和行为的定制是大多设置属性的问题。