There are some great changes in 2.0 version.

Console in tutorial:

In previous version, there will be console tool in render result. You can input some js code and run in result page. Just just debug tool of chrome.

And in 2.0 version, user can enable a console bar and result view in tutorial page. Then when user read the tutorial and he can input the js code in console and check the result in a result modal.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Example code:

In version 2.0, I added the sample code, which can be used when user edit in “try” view. Then when user creates his visualization, he can refer the example code.

iLearning D3.js 2.0 released的更多相关文章

  1. A better way to learn D3 js - iLearning D3.js

    iLearning D3.js Basic is an iPad app to learn and code with D3. In 1.1 version, new tutorial is prov ...

  2. 【 D3.js 高级系列 — 10.0 】 思维导图

    思维导图的节点具有层级关系和隶属关系,很像枝叶从树干伸展开来的形状.在前面讲解布局的时候,提到有五个布局是由层级布局扩展来的,其中的树状图(tree layout)和集群图(cluster layou ...

  3. 【 D3.js 高级系列 — 9.0 】 交互式提示框

    一般来说,图表中不宜存在过多文字.但是,有时需要一些文字来描述某些图形元素.那么,可以实现一种交互:当用户鼠标滑到某图形元素时,出现一个提示框,里面写有描述文字.这是一种简单.普遍的交互式,几乎适用于 ...

  4. 【 D3.js 高级系列 — 8.0 】 标线

    有时候,需要在地图上绘制连线,表示"从某处到某处"的意思,这种时候在地图上绘制的连线,称为"标线". 1. 标线是什么 标线,是指地图上需要两个坐标以上才能表示 ...

  5. 【 D3.js 高级系列 — 7.0 】 标注地点

    有时需要告诉用户地图上的一些目标,如果该目标是只需要一个坐标就能表示的,称其为"标注". 1. 标注是什么 标注,是指地图上只需要一个坐标即可表示的元素.例如,在经纬度(116, ...

  6. 【 D3.js 高级系列 — 6.0 】 值域和颜色

    在[入门 - 第 10 章]作了一张中国地图,其中各省份的颜色值都是随意赋值的.如果要将一些值反映在地图上,可以利用颜色的变化来表示值的变化. 1. 思路 例如,有值域的范围为: [10, 500] ...

  7. 【 D3.js 高级系列 — 5.0 】 颜色

    颜色是作图不可少的概念,常用的标准有 RGB 和 HSL,D3 提供了创建颜色对象的方法,能够相互转换和插值. RGB色彩模式是通过对红(Red).绿(Green).蓝(Blue)三个颜色通道相互叠加 ...

  8. 【 D3.js 高级系列 — 4.0 】 矩阵树图

    矩阵树图(Treemap),也是层级布局的扩展,根据数据将区域划分为矩形的集合.矩形的大小和颜色,都是数据的反映.许多门户网站都能见到类似图1,将照片以不同大小的矩形排列的情形,这正是矩阵树图的应用. ...

  9. 【 D3.js 高级系列 — 3.0 】 堆栈图

    堆栈图布局(Stack Layout)能够计算二维数组每一数据层的基线,以方便将各数据层叠加起来.本文讲解堆栈图的制作方法. 先说说什么是堆栈图. 例如,有如下情况: 某公司,销售三种产品:个人电脑. ...

随机推荐

  1. python参考手册 Read

    P28 复制 a = [1,2,3,[1,2]] b = a b is a # True c = list[a] # shallow copy c is a # False c[3][0] = 100 ...

  2. twisted internet.reactor部分 源码分析

    twisted.internet.reactor 是进行所有twisted事件循环的地方. reactor在1个python进程中只能有一个. 在windows下用的是select.linux下epo ...

  3. Challenge Checkio(python)—初尝python练习网站

    最近在找点python语言练习的网站,发现这个网站不错 http://www.checkio.org/ 页面设计的也比较漂亮,比较适合学习python的语法知识.不过注册这个网站 开始就得解决一个py ...

  4. Django路由

    一.路由流程 1. 用户浏览器发出请求后,通过根url设置,去找urlpattern变量.在setting.py中对 ROOT_URLCONF进行配置,以确定根URLconf(URL configur ...

  5. Python按照索引访问list

    由于list是一个有序集合,所以,我们可以用一个list按分数从高到低表示出班里的3个同学: >>> L = ['Adam', 'Lisa', 'Bart'] 那我们如何从list中 ...

  6. Ajax简单实现文件异步上传的多种方法

    1. 认识FormData对象 FormData是Html5新加进来的一个类,可以模拟表单数据 构造函数 FormData (optional HTMLFormElement form) (可选) 解 ...

  7. [转载]C#实现POST提交方式

    网页自动登录和提交POST信息的核心就是分析网页的源代码(HTML),在C#中,可以用来提取网页HTML的组件比较多,常用的用WebBrowser.WebClient.HttpWebRequest这三 ...

  8. 如何用 Retrofit 2 在安卓上实现 HTTP 访问?

    最近,笔者对安卓开发的兴趣愈发浓厚,而且不断尝试了许多传闻很棒的开发库 -- 大部分也真的很不错.于是打算写一个系列文章,介绍使用这些让人惊叹的库建立安卓示例应用的实践.这样,读者可以自行判断,这些库 ...

  9. 设置Tomcat的UTF-8编码

    利用request.setCharacterEncoding("UTF-8");来设置Tomcat接收请求的编码格式,只对POST方式提交的数据有效,对GET方式提交的数据无效! ...

  10. UVA 1160 X-Plosives

    题意是一次装入物品,物品由两种元素组成,当遇到即将装入的物品与已经装入的物品形成k个物品,k种元素,跳过该物品的装入.可以将每种元素看成顶点,物品看成一条边.这样问题就转化为利用并查集求环的情况. 算 ...