D3js可视化 提 问 未 解 答 新手级别pop2010条形图打开方式

前面写了虚假的可视化
现在告诉你真正的打开方式

毕竟我可是打了一天

这效率
可太低了

不过!

!!!!!!!!!!!
敲代码遇到很多问题
才是正确打开方式啊
!!!!!!!!!!!

接下来看我是怎么做到用将近一天的时间把这个看起来简单其实也简单的条形图做出来的
效果图和之前一样

但它的内在已经发生改变了
形容一下可能就是:
惊天动地的进化

给你看给你看

就是这样,这就是效果图
就是这样,这就是效果图
可以看看图标,我觉得肥肠满意

首先

对着昨天(之前)的虚假可视化代码
----------------------------------------------------Sublime Text3多屏操作---------------------------------------------
Sublime Text3多屏操作
我先把文字啥的加进去
矩形,比例尺,坐标轴先放在后面
css样式表和昨天的一样不变

然后

开始我的画布之旅
艰辛+苦涩.jpg
刚开始打的时候,因为之前照着网站打过,又看到书上这句话
应该是我还没有理解吧
应该是我还没有理解吧。。。
于是我开始
肆意发挥
我的代码变成了这个样子
为了起到震撼的效果,我把字体变到最小
为了起到震撼的效果,我把字体变到最小
其实刚开始啥变量都没加

var svg = body.append("svg");

var body = d3.select("body");

就这两家伙打 天 下 ,一直append就完事了
运行出来:一 片 空 白 cool

到现在我还不知道错哪了我真傻,希望好心人告诉我一下,十分感谢

再然后

1.就重新跟着书上 先把所有的东西加好

改改改

2.用变量

接着改改改

到这里勉强过了很久吧,放张图,因为痕迹还留着嘻嘻,
要有存在的价值
大致就是这样,除了矩形循环的那块代码
大致就是这样,除了矩形循环的那块代码
当时为了方便随便起的名字,来自菜鸡的草率

3.用循环

继续改改改

4.不用除了零以外的数字

还要改改改

另外,呃,在矩形那块我是直接先用了循环,
17组数据呢!太可怕了!我选择循环!我爱他!
必须大声说出来,我是自己写的啊哈哈哈哈
一次过啊哈哈哈哈哈哈哈哈哈哈哈哼哈哈哈

接下来 是遇到的错误

大致上就是stroke少了r啊
或者是分!号!没!有!加!啊!
或者是类名抄错了啊
或者是x,y的属性搞反了啊
或者是数组引用错误了啊
…… ……
路子比较野,错误比较傻
无碍 我菜给自己看
哼哼哼

反正

效果总算是出来了

最后贴代码?
我考虑一下
下次见吧哈哈哈哈
改天放上来呗,反正我也不火,我拖拖=稳妥妥


我真傻我忘记了我是咕咕之神,代码应该被我删掉了吧- -
ending

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值