我正在考虑如何调试代码,对于我的散点图3d,关于线和点。
这是代码:
series: [{
name: 'Reading',
colorByPoint: true,
data: coloriamo()},{ // this function draws some points
data: [[0,750,0],[10,750,0] //this data draw a line
],
lineWidth: 1,
enableMouseTracking: false,
marker: {
enabled: false
},
color: 'rgba(0,0,0,0.51)'
},{
data: [[175,750,5],[180,750,5] //draw line in the half of bottom frame
],
lineWidth: 1,
enableMouseTracking: false,
marker: {
enabled: false
},
color: 'rgba(0,0,0,0.51)'
},{
data: [[0,750,10],[10,750,10] //draw a line
],
lineWidth: 1,
enableMouseTracking: false,
marker: {
enabled: false
},
color: 'rgba(0,0,0,0.51)'
},{
data: [[11,750,-0.3]], //draw a point for first line
dataLabels: {
style: {
textShadow: 0
},
enabled: true,
crop: false,
overflow: false,
format: 0+'\u00B0'+' N',
},
marker: {
enabled: false,
states: {
hover: {
enabled: false
}
}
}
},{
data: [[11,750,4.7]], //a point for second line
dataLabels: {
style: {
textShadow: 0
},
enabled: true,
crop: false,
overflow: false,
format: 5+'\u00B0'+' N',
},
marker: {
enabled: false,
states: {
hover: {
enabled: false
}
}
}
},{
data: [[11,750,9.3]], //draw line for third line
dataLabels: {
style: {
textShadow: 0
},
enabled: true,
crop: false,
overflow: false,
format: 10+'\u00B0'+' N',
},
marker: {
enabled: false,
states: {
hover: {
enabled: false
}
}
}
}]
这是jsfiddle
问题是xAxis和Zaxis的“ max:”和“ min:”发生了变化,因此DATA(绘制线和点)的值也会发生变化。
我必须在返回数组的数据中添加一个函数来绘制线和点,但我不知道哪里有更好的方法。
最糟糕的方法是制作3个函数(每个“数据行”一个函数)和3个函数用于点,并将每个函数添加到数据。
var mycharts = [[35,40,173,180]]; //min.zAxis,max.zAxis,min.xAxis,maxxAxis
function linefirst(){
for (var s = 0; s <mycharts.length; s++) {
var cas= mycharts[s];
var minZ= cas[0];
var maxZ= cas[1];
var minX= cas[2];
var maxX= cas[3];
var middleZ= (minZ+maxZ)/2;
}
var arraylinef=[];
arraylinef.push([[minX,750,minZ],[maxX,750,minZ]]);
return arraylinef;
}
function linesecond(){
for (var s = 0; s <mycharts.length; s++) {
var cas= mycharts[s];
var minZ= cas[0];
var maxZ= cas[1];
var minX= cas[2];
var maxX= cas[3];
var middleZ= (minZ+maxZ)/2;
}
var arraylines=[];
arraylines.push([[minX,750,middleZ],[maxX,750,middleZ]]);
return arraylines;
}
function linethird(){
for (var s = 0; s <mycharts.length; s++) {
var cas= mycharts[s];
var minZ= cas[0];
var maxZ= cas[1];
var minX= cas[2];
var maxX= cas[3];
var middleZ= (minZ+maxZ)/2;
}
var arraylinet=[];
arraylinet.push([[minX,750,maxZ],[maxX,750,maxZ]]);
return arraylinet;
}
现在有3个功能可以画3点:
function pointfirst(){
for (var s = 0; s <mycharts.length; s++) {
var cas= mycharts[s];
var minZ= cas[0];
var maxZ= cas[1];
var minX= cas[2];
var maxX= cas[3];
var pointX= maxX+1;
var pointfZ= minZ-0.3;
var middleZ= (minZ+maxZ)/2;
}
var arraypointf=[];
arraypointf.push([[pointX,750,pointfZ]]);
return arraypointf;
}
function pointsecond(){
for (var s = 0; s <mycharts.length; s++) {
var cas= mycharts[s];
var minZ= cas[0];
var maxZ= cas[1];
var minX= cas[2];
var maxX= cas[3];
var pointX= maxX+1;
var middleZ= (minZ+maxZ)/2;
var pointsZ= middleZ-0.3;
}
var arraypoints=[];
arraypoints.push([[pointX,750,pointsZ]]);
return arraypoints;
}
function pointthird(){
for (var s = 0; s <mycharts.length; s++) {
var cas= mycharts[s];
var minZ= cas[0];
var maxZ= cas[1];
var minX= cas[2];
var maxX= cas[3];
var pointX= maxX+1;
var pointtZ= maxZ-0.5;
}
var arraypointt=[];
arraypointt.push([[pointX,750,pointtZ]]);
return arraypointt;
}
正如你所看到的那样,代码太过分了,这不是一个好主意...... 所以你能建议我吗?
对不起,这个大帖子和大代码......
谢谢!