normal曲线绘制
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div id="main" style="width: 600px;height:400px;"></div> <script src="./js/echarts.js"></script> <script> // app.title = '多 X 轴示例'; //已知x轴上的点: var leftx, zero, maxPos, my, rightx; var xAxisData = [leftx,zero,maxPos,my,rightx]; //var xData = [-0.5, 0, 0.1, 0.4, 0.8]; // var xData = [leftx,zero,-leftx,]; //示例数据 var data1 = [[-0.5,5],[0,30],[0.1,90],[0.6,30],[0.8,5]]; // var data1 = [[-0.5,5],[0,30],[0.3,60]]; // var data2 = [[-0.5,5],[0,50],[0.1,90],[0.4,30],[0.8,5]]; var data1 = [5,50,90,30,5]; var data2 = [[-0.5,5],[0,50],[0.15,90],[0.4,30],[0.8,5]]; // var xData = [-0.5,0,0.15,0.4,0.8]; // var yData = [5,50,90,30,5]; //使用双坐标轴 绘制两遍:上面一个坐标轴使用category类型 下面使用type:value类型 (负的使用绿色 正的使用红色和上面使用category的红色重合) // 正态分布 function normal(u,d,x){ var PI = 3.1415926; var y = (1/(Math.sqrt(2*PI)*d))*Math.exp(-(x-u)*(x-u)/(2*d*d)); y = y.toFixed(2); return y; } //计算方差 var data2= []; var xData = [-0.5,0,0.15,0.4,0.8]; var u = 0.15, d = 0.16; //均值 方差 for(var i=0,len=xData.length;i<len;i++){ var x = xData[i]; var y = normal(u,d,x); // var y = getY(x,u); data2.push([x,y]); } function getY(x,c){ var y ; if(x-c>0){ y= 1/(x-c); }else if(x==c){ y = 1/0.0001; }else { y = -1/(x-c); } y = y.toFixed(2); return y; } function getCenterY(x){ } console.log('data2',data2); var colors = ['#5793f3', '#d14a61', '#675bba']; var option = { color: colors, tooltip: { trigger: 'none', axisPointer: { type: 'cross' } }, legend: { data:['line2 '] }, // grid: { // top: 70, // bottom: 50 // }, xAxis: [ { type: 'value', //category 坐标轴在上方 axisTick: { alignWithLabel: true }, axisLine: { onZero: false, lineStyle: { color: colors[1] } }, axisPointer: { label: { /*formatter: function (params) { return '降水量 ' + params.value + (params.seriesData.length ? ':' + params.seriesData[0].data : ''); }*/ } }, // data: xData }, ], yAxis: [ { type: 'value', show:false } ], visualMap: { // type: 'continuous', // 定义为连续型 viusalMap show: false, dimension: 0, //指明维度 [[x1,y1],[x2,y2],...] 0代表x1 x2 1代表y1,y2 pieces: [{ lte: 0, color: 'green' }, { gt: 0, lte: 1, color: 'red' }] }, series: [ { name:'line2', type:'line', smooth: "true", // xAxisIndex: 1, data: data2, //[5,30,90,30,5], symbol: 'circle', symbolSize: 8, // color:"blue", // lineStyle:{ // color:"red", // opacity:0.5 // }, itemStyle: { normal: { borderWidth: 0, borderColor:'' , color: '' }, emphasis: { label:{ show:true, }, borderWidth: 0, borderColor:'' , color: '' } }, markPoint: { data: [ { coord:[0.4,30], value: '您的位置', symbol:"rect", symbolSize:[80,25], symbolOffset:[45,-20] } ] }, } ] }; // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('main')); myChart.setOption(option); </script> </body> </html>