echarts图标使用(一)
var data = [];
// Parametric curve
// for (var t = 0; t < 25; t += 0.001) {
// var x = (1 + 0.25 * Math.cos(75 * t)) * Math.cos(t);
// var y = (1 + 0.25 * Math.cos(75 * t)) * Math.sin(t);
// var z = t + 2.0 * Math.sin(75 * t);
// data.push([x, y, z]);
// }
// console.log(data.length);
x1 = [7,7,8.5,10,10]
y1 = [0,10,5,0,10]
z1 = [4,5,3,4,5]
option = {
tooltip: {},
backgroundColor: '#fff',
visualMap: {
show: false,
dimension: 2,
min: 0,
max: 30,
inRange: {
color: ['#313695', '#4575b4', '#74add1', '#abd9e9', '#e0f3f8', '#ffffbf', '#fee090', '#fdae61', '#f46d43', '#d73027', '#a50026']
}
},
xAxis3D: {
type: 'value'
},
yAxis3D: {
type: 'value'
},
zAxis3D: {
type: 'value'
},
grid3D: {
viewControl: {
projection: 'orthographic',
orthographic:200
}
},
series: [{
type: 'surface',//surface bar3D
// data: data,
lineStyle: {
width: 4
},
equation: {
x: {
step: 0.5,
min: 0,
max: 10,
},
y: {
step: 0.5,
min: 0,
max: 10,
},
z: function (x, y) {
if(x> Math.min.apply(null,x1) && x<Math.max.apply(null,x1)){
return 3;
}
// var zf = []
// for(var i = 0; i<datas.length;i++){
// // var theta = r1+r1*Math.random()
// // tmp = Math.pow((x-datas[i][0])/theta,p)+ Math.pow((y-datas[i][1])/theta,p)
// tmp = Math.pow((x-datas[i][0])/r1,p)+ Math.pow((y-datas[i][1])/r1,p)
// zf[i] = -datas[i][2] * Math.pow(Math.E,-tmp)
// // zf[i] = -datas[i][2] * Math.sin(tmp)
// }
// for(var j = 0; j<datas.length;j++){
// if(x == datas[j][0] && y== datas[j][1]){
// return zf[j];
// } else {
// var value_min = zf[0]
// for(var k = 0 ; k<zf.length;k++){
// if(value_min>zf[k]){
// value_min = zf[k]
// }
// }
// return value_min
// // return Math.min(zf[0],zf[1],zf[2])
// }
// }
// // switch((x,y)){
// // case (datas[j][0],datas[j][1]):
// // return zf[0]
// // break;
// // case (datas[j+1][0],datas[j+1][1]):
// // return zf[1]
// // break;
// // case (datas[j+2][0],datas[j+2][1]):
// // return zf[2]
// // break;
// // default:
// // return Math.min(zf[0],zf[1],zf[2])
// // }
// // return Math.min(zf[0],zf[1],zf[2])
}
}
}]
};
echarts图标使用(一)的更多相关文章
- Echarts图标宽度变成100px,让图表宽度随着父元素自动适应,Vue实时监听宽度的变化,这可能是史上最好的解决方案!
最近工作中element后台管理使用Echarts图表,本后台项目分图表模式和列表模式,使用display控制显示隐藏,这样就引出了本文的问题. 问题1:Echarts图标宽度变成100px? 问题2 ...
- Echarts图标自适应问题(已解决)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- echarts图标相关
图标类型参考地址: http://echarts.baidu.com/echarts2/doc/doc.html 知识点一: 堆叠柱状图与普通柱状图的区别在于: 堆叠柱状图 在series中需要设置 ...
- echarts图标legend全选功能添加
平时做图表的时候经常用echarts,确实是一款很好用的插件. 开发中遇到了一个问题,在展示的曲线,也就是legend很多的时候,不太好只展示其中几条.配置中是可以默认设置初始化是否展示,但不适用于全 ...
- element-admin中echarts图标宽度无法修改
默认示例 <template> <div> <el-row :gutter="0"> <el-col :xs="24" ...
- Echarts图表控件使用总结2(Line,Bar)—问题篇
Echarts图表控件使用总结1(Line,Bar):http://www.cnblogs.com/hanyinglong/p/Echarts.html 1.前言 a.前两天简单写了一篇在MVC中如何 ...
- Echarts图表控件使用总结1(Line,Bar)
问题篇(详解):http://www.cnblogs.com/hanyinglong/p/4708337.html 1.前言 a.在系统开发过程中可能会使用到图表控件,一个好的图标控件可以使我们的网站 ...
- 如何快速使用ECharts绘制可视化图表
1.在ECharts官网,下载ECharts的源码和示例文件. 2.解压缩下载下来的Echars压缩包,找到doc\example\www\echartsjs目录,将里面的js文件全部取出来,放到项目 ...
- 【可视化】DataV接入ECharts图表库 可视化利器强强联手
DataV接入ECharts图表库 可视化利器强强联手 摘要: 两个扛把子级产品的结合,而且文末有彩蛋. DataV 数据可视化是搭建每年天猫双十一作战大屏的幕后功臣,ECharts 是广受数据可视化 ...
随机推荐
- python3 类的属性、方法、封装、继承及小实例
Python 类 Python中的类提供了面向对象编程的所有基本功能:类的继承机制允许多个基类,派生类可以覆盖基类中的任何方法,方法中可以调用基类中的同名方法. 对象可以包含任意数量和类型的数据. p ...
- [CSP-S模拟测试]:小盆友的游戏(数学 or 找规律)
题目传送门(内部题110) 输入格式 第一行一个整数$N$,表示小盆友的个数. 第二行$N$个整数$A_i$,如果$A_i=-1$表示$i$目前是自由身,否则$i$是$A_i$的跟班. 输出格式 一个 ...
- 两种建立堆的方法HeapInsert & Heapify
参考 堆排序中两种建堆方法的比较 第一种方法HeapInsert 它可以假定我们事先不知道有多少个元素,通过不断往堆里面插入元素进行调整来构建堆. 它的大致步骤如下: 首先增加堆的长度,在最末尾的地方 ...
- HTML和CSS 入门系列(二):文字、表单、表格、浮动、定位、框架布局、SEO
上一篇:HTML和CSS 入门系列(一):超链接.选择器.颜色.盒模式.DIV布局.图片 一.文字 1.1 属性 1.2 字体样式:font-family 1.3 字体大小:font-size 1.4 ...
- H5视频活动踩坑
最近做了一些嵌入视频的活动,积累了点视频方面的经验,下面记录下别人和自己踩过的坑以及相应的解决方案.1.碰到问题和解决方案1.1.ios 网页中播放视频默认全屏(点击视频会弹出播放器进行全屏播放).解 ...
- line-height与vertical-align:简单的属性不简单
学习过CSS肯定对line-height与vertical-align两个属性有印象:line-height用来设置行高,vertical-align用来设置文本垂直方向的对齐方式,两种看似十分简单, ...
- web 多屏互动显示方案
1 基于 local storage 实现的信息传递 相关插件 lsbridge.js https://github.com/krasimir/l... 且项目中有非常简单易懂的示例你需要了解的一些关 ...
- hdfs、zookeepeer之HA模式
HA简介 1.所谓HA,即高可用(high available) 2.消除单点故障,避免集群瘫痪,hdfs中namenode保存了整个集群的元数据,如果namenode所在机器宕机,则整个集群瘫痪,H ...
- 黑马lavarel教程---7、文件上传
黑马lavarel教程---7.文件上传 一.总结 一句话总结: 在laravel里面实现文件的上传是很简单的,压根不用引入第三方的类库,作者把上传作为一个简单的http请求看待的. 1.在lavar ...
- js style.display = "" 和style.display="none" 区别
style.display = "":是清除display样式,display将使用默认值(块元素会变成block,内联元素会变成inline)style.display=&quo ...