理论上两点一线,只要两个点即可 option = { title: { text: '', left: 'center' }, tooltip: { // trigger: 'item', // formatter: '{a} <br/>{b} : {c}' }, lineStyle: { normal: { type: 'solid', width: 30 } }, legend: { left: 'left', data: [''] }, xAxis: { type: 'category'…

众所周知想用canvas画一条曲线我们可以使用这些函数: 二次曲线:quadraticCurveTo(cp1x, cp1y, x, y) 贝塞尔曲线:bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y) 画圆弧:arcTo(x1,y1,x2,y2,radius); 但是如果一组点给你,怎么通过这些已知点画一条平滑的曲线呢?使用二次曲线,或是圆弧?恐怕这些都没法满足曲线多变的需求,唯一的方法就是一段贝塞尔曲线连着一段贝塞尔曲线.于是乎我在百度上大海捞针,发现居然没…

昨天,写了一篇关于圆环进度条的博客(请移步:Vue/React圆环进度条),已经烦不胜烦,今天又遇到了需要展示类似公司的组织结构图的功能需求,要冒了!!! 这种需求,自己用div+css也是可以实现的,但是没有什么动画效果,我的css3又很差劲,而且项目中已经使用到了折线图.饼状图.柱状图之类的图表,用的还是百度的echarts,所以这个组织结构图之类的需求也就用了百度的echarts来实现了. 以前用echarts写折线图.柱状图.饼状图的较多,它的API还算比较熟悉,但是画组织结构这样的树状…

这篇博文主要是利用echarts实现两条以及多条可拖动节点的曲线,demo脱胎于官方demo,在官方demo的基础上添加了另一条曲线.因为之前写过一篇在vue中使用echarts实现可拖动节点的折线图,并可配置拖动方向及拖动上下限,所以本篇文章以最简单的方式说明如何实现多条曲线的可拖动,故不再实现其他配置,如果对上下限和拖动方向需要控制的同学可以参考我的另一篇博文:https://www.cnblogs.com/p-l-u-m/p/10691684.html:同时如果有问题或建议欢迎留言探讨.…

转自:http://blog.csdn.net/cywosp/article/details/6724522 在一个平面上画1999条直线,最多能将这一平面划分成多少个部分? 没有直线时有一个空间:(1) 1条直线时,这条这些可以将这个空间分成两个:(1+1) 2条直线时,第二条直线可以和第一条直线相交,这样第二条直线可以将两个空间分成四个:(1+1+2) .... 注意到画每条直线时能增加多少个空间,取决于此直线从多少个空间中通过. 而从多少个空间中通过,取决于和多少条直线相交. 例如,在画第…

我在开发中使用canvas的机会不是很多,但是第一次实际使用中就遇到了问题,"很久很久以前,我自己画了一个雷达图,线宽都是1像素,但是显示效果不如期望,这才发现canvas中的画线还是有坑的",对比一下两个图,可以发现下图比较清晰.   我们先画一个线宽为1像素的线,代码和显示效果如下: const ctx = document.getElementById(canvas).getContext("2d"); ctx.strokeStyle = "re…

[本文出自天外归云的博客园] 需求 1. Vue中使用ECharts画散点图 2. 在图中加入加均值线 3. 在图中标注出阴影区域 实现 实现这个需求,要明确两点: 1. 知道如何在vue中使用echarts 2. 要知道如何在echarts散点图中画均值线和阴影区域 在下面的代码option对象的series属性中用到了markLine和markArea,标注最值用到了markPoint. 所以去官方文档搜索标线.标点.标图的关键字要搜mark. 如何在vue中使用echarts见文末. 需要…

1.scale方法 { height: 1px; transform: scaleY(0.5); transform-origin: 50% 100%; // 要指定origin值, 要不然会模糊 content: ""; position: absolute; width: 100%; left: 0; bottom: 0; background: red; } 2.线性渐变linear-gradient, 流览器上面都不完美,效果都是虚的,和完美的0.5px还是有差距 3.使用bo…

一. 生成项目及安装插件 # 安装vue-cli npm install vue-cli -g # 初始化项目 vue init webpack china-map # 切到目录下 cd china-map # 安装项目依赖 npm install # 安装 vuex npm install vuex --save # 安装 axios npm install axios --save # 安装 ECharts npm install echarts --save 二. 项目结构 ├── ind…

今天周末休息,想好好补补课,无奈,弄了一上午,全部都是半边拉块的demo,有一种深深的挫败感. 中午睡醒一觉后,又看了一集“奔跑吧兄弟”,然后一下午时间就过去了. 仔细一想,应该是我的补课方法不对:要补的东西太多了,必须得从大处入手,如果从小处入手,那得花老鼻子的时间来弄了. 然后,那就从困扰了好久的画线开始吧. 前两天做项目,头儿让我用画线实现一个功能,他一说画线我就打怵,因为对这一方面不是很熟,这几天鼓捣了几下子,但是每次都是做着做着这个,又发现了另外一个不会的东东,转战去其他战场了,等反应…