- 博客(14)
- 资源 (45)
- 收藏
- 关注
原创 canvas绘制随机移动的气泡
Bouncing Balls body { background: #dddddd; } #canvas { margin-left: 10px; margin-top: 10px; background: #ffffff;
2017-03-30 16:24:47 3671
原创 canvas响应鼠标事件
Sprite sheets body { background: #dddddd; } #canvas { position: absolute; left: 0px; top: 20px; margin:
2017-03-29 16:27:40 12218
原创 canvas绘制时钟
Clock body { background: #dddddd; } #canvas { position: absolute; left: 0px; top: 0px; margin: 20px;
2017-03-28 17:14:46 551
原创 canvas元素的大小与绘图表面的大小
使用css来设置canvas元素的大小,与直接设置属性相比,其差别是基于这样一个事实,canvas元素实际上有两套尺寸,一个是元素本身的大小,还有一个是元素绘图表面的大小当设置元素的width与height 属性时,实际上是同时修改了该元素本身的大小与元素绘图表面的大小,通过css来设定canvas元素的大小,只会改变元素本身的大小,canvas绘图表面默认大小300x150像素,所以当can
2017-03-27 16:39:59 1988
原创 canvas绘制文字
Canvas element size: 600 x 300, Canvas drawing surface size: 600 x 300 body { background: #dddddd; } #canvas { margin: 10px; pa
2017-03-27 16:15:00 704
原创 http请求头和响应头
1. HTTP请求头accept:浏览器通过这个头告诉服务器,它所支持的数据类型。如:text/html, image/jpegaccept-Charset:浏览器通过这个头告诉服务器,它支持哪种字符集。accept-encoding:浏览器通过这个头告诉服务器,它支持哪种压缩格式。accept-language:浏览器通过这个头告诉服务器,它的语言环境。host:浏览器通过这
2017-03-24 13:44:31 342
原创 d3js实现力学图+人物关系图
描述人物关系的数据结构{"nodes":[{ "name": "云天河" , "image" : "tianhe.png" },{ "name": "韩菱纱" , "image" : "lingsha.png" },{ "name": "柳梦璃" , "image" : "mengli.png" },{ "name": "慕容紫英" , "image" : "ziying
2017-03-16 09:51:29 10958 1
原创 d3js制作可拖动地图
效果图源码 Map Force .link { stroke: #ccc; stroke-width: 1;} var width = 1000; var height = 1000; var svg = d3.select("body").append("svg") .att
2017-03-15 10:13:59 1926
原创 d3js制作打包图
效果图:数据结构{"name":"中国","children":[ { "name":"浙江" , "children": [ {"name":"杭州" }, {"name":"宁波" }, {"name":"温州" }, {"name":"绍兴" } ] }, {
2017-03-13 10:41:26 913 1
原创 d3js创建集群图
效果图:数据结构{"name":"中国","children":[ { "name":"浙江" , "children": [ {"name":"杭州" }, {"name":"宁波" }, {"name":"温州" }, {"name":"绍兴" } ] },
2017-03-10 18:20:05 984
原创 d3js之弦图
效果图 弦图 .chord path { fill-opacity: 0.67; stroke: #000; stroke-width: 0.5px; } //1.定义数据 // 城市名 var city_name = [ "北京" ,
2017-03-10 11:11:41 732
原创 d3.js之力导向图
效果图 力导向图 var nodes = [ { name: "桂林" }, { name: "广州" }, { name: "厦门" }, { name: "杭州" }, { name: "上海
2017-03-09 18:20:28 2658 2
原创 用d3.js画饼状图
饼状图 var width = 400; var height = 400; var dataset = [ 30 , 10 , 43 , 55 , 13 ]; var svg = d3.select("body") .append("svg") .attr("width", width)
2017-03-09 17:33:36 1562 1
原创 前端数据可视化工具库
选择 D3:如果希望开发脑海中任意想象到的图表。选择 Highcharts、Echarts 等:如果希望开发几种固定种类的、十分大众化的图表。https://www.hcharts.cn/demo/highcharts/line-ajax(完美支持移动端)
2017-03-09 16:32:50 1350
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人