Как я могу создать ось x, как показано ниже?Настройка интервалов галочки с высоким качеством
1----------10-----40--50--60-----90---------100
Например, интервал beetwen 1 и 10 равна 10pxs, но между 10 и 40 5pxs только
Как я могу создать ось x, как показано ниже?Настройка интервалов галочки с высоким качеством
1----------10-----40--50--60-----90---------100
Например, интервал beetwen 1 и 10 равна 10pxs, но между 10 и 40 5pxs только
Это не поддерживается, но возможно путем перезаписи translate
метод: http://jsfiddle.net/dv60w8gc/13/
Например, нормальная вероятность распределение по YAxis:
Highcharts.wrap(Highcharts.Axis.prototype, 'translate', function (proceed) {
// Normal Translation
var result = proceed.apply(this, [].slice.call(arguments, 1));
// Apply curving
if (this.options.curvature) {
var val = (arguments[1]/(this.max - this.min)) * (Math.PI) - (Math.PI/2),
val2 = (Math.sin(val) + 1)/2;
result = (this.len * val2);
if (arguments[2] == 0) {
result = this.len - result;
}
}
return result;
});
$('#container').highcharts({
yAxis: {
min: 0,
max: 1,
tickInterval: 0.1,
curvature: true
},
series: [{
data: [0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1]
}]
});
Ниже кода добавляет tickPositions [133, 141, 150, 160, 171, 185, 200, 21 8, 240, 267, 300, 343, 400, 480, 600, 800, 1200, 2400] при равномерном расстоянии, как указано в прикрепленном изображении. enter image description here
H.wrap(H.Axis.prototype, 'translate', function (proceed) {
var result = proceed.apply(this, [].slice.call(arguments, 1));
if (this.options.curvature) {
var tickPos = [133, 141, 150, 160, 171, 185, 200, 218, 240, 267, 300, 343, 400, 480, 600, 800, 1200, 2400];
var tickPosLen = [275, 259, 243, 227, 211, 195, 178, 162, 146, 130, 114, 98, 81, 65, 49, 33, 17, 1];
var index = tickPos.indexOf(arguments[1]);
if (index >= 0) {
result = tickPosLen[index];
}
if (arguments[2] == 0) {
var arrBiggerElements = tickPos.filter((inArray) => {
return inArray > arguments[1];
});
var nextElement = Math.min.apply(null, arrBiggerElements);
var nextElementIndex = -1;
var prevElementIndex = -1;
if (nextElement == null) {
prevElementIndex = tickPos.length - 1;
} else {
nextElementIndex = tickPos.indexOf(nextElement);
prevElementIndex = nextElementIndex - 1;
}
var nextTickValue = -1;
var prevTickValue = -1;
if (nextElementIndex > 0) {
nextTickValue = tickPos[nextElementIndex];
}
if (prevElementIndex > 0) {
prevTickValue = tickPos[prevElementIndex];
}
if (nextTickValue > 0 && prevTickValue > 0) {
var fac = (nextTickValue - prevTickValue)/16;
var decrement = (arguments[1] - prevTickValue)/fac;
var lowerPointLen = tickPosLen[prevElementIndex];
result = lowerPointLen - decrement;
}
result = this.len - result;
}
}
return result;[enter image description here][1]
Но, как? Согласно документации API, «tickPositioner» возвращает простой массив данных. Нет ничего о пиксельных интервалах между тиками. Демо-скрипт не уточняет. – user3359229
В 'tickPositioner' у вас есть доступ к' this.width' - поэтому вы знаете min, max и width оси. Теперь просто напишите логику, чтобы вернуть простой массив в соответствии с позициями, которые вы хотите. –
Можете ли вы показать пример, как использовать «this.width»? – user3359229