2015-02-11 2 views
2

хороший деньПозиционирование отдельной метки на участке разброса в AMcharts

Я надеюсь, что кто-то может мне помочь. Я создал график рассеяния на AMcharts, и каждая точка данных имеет свой собственный ярлык, но как только я добавлю больше данных, надписи над потоком. Я пробовал позиционировать каждую этикетку индивидуально, но я не могу понять ее правильно. Я также попытался использовать функцию labelFunction, чтобы изменить положение отдельной точки данных, но я не уверен, что делаю это правильно. Может кто-то, пожалуйста, помогите мне.

Я действительно борюсь с этой штукой.

JavaScript

var chart = AmCharts.makeChart("chartdiv", { 
"type": "xy", 
"pathToImages": "http://www.amcharts.com/lib/3/images/", 
"theme": "none", 
"dataProvider": [{ 
    "y": 10, 
    "x": 14, 
    "value": 59, 
    "y2": -5, 
    "x2": -3, 
    "value2": 44 
}, { 
    "y": 5, 
    "x": 3, 
    "value": 50, 
    "y2": -15, 
    "x2": -8, 
    "value2": 12 
}, { 
    "y": -10, 
    "x": 8, 
    "value": 19, 
    "y2": -4, 
    "x2": 6, 
    "value2": 35 
}, { 
    "y": -6, 
    "x": 5, 
    "value": 65, 
    "y2": -5, 
    "x2": -6, 
    "value2": 168 
}, { 
    "y": 15, 
    "x": -4, 
    "value": 92, 
    "y2": -10, 
    "x2": -8, 
    "value2": 102 
}, { 
    "y": 13, 
    "x": 1, 
    "value": 8, 
    "y2": -2, 
    "x2": 0, 
    "value2": 41 
}, { 
    "y": 1, 
    "x": 6, 
    "value": 35, 
    "y2": 0, 
    "x2": -3, 
    "value2": 16 
}], 
"valueAxes": [{ 
    "position":"bottom", 
    "axisAlpha": 0 
}, { 
    "minMaxMultiplier": 1.2, 
    "axisAlpha": 0, 
    "position": "left" 
}], 
"graphs": [{ 
    "balloonText": "x:<b>[[x]]</b> y:<b>[[y]]</b><br>value:<b>[[value]]  </b>", 
    "bullet": "circle", 
    "bulletBorderAlpha": 0.2, 
    "bulletAlpha": 0.8, 
    "lineAlpha": 0, 
    "fillAlphas": 0, 
    "valueField": "value", 
    "xField": "x", 
    "yField": "y", 
    "maxBulletSize": 100, 
    "labelText": "[[x]]", 
    "labelFunction": function(obj,label) { 
     setTimeout(function() { 
      console.log(obj.bulletGraphics.node.nextElementSibling); 
     },100); // delay to generate the element 
     return label; 
    } 
}, { 
    "balloonText": "x:<b>[[x]]</b> y:<b>[[y]]</b><br>value:<b>[[value]]</b>", 
    "bullet": "diamond", 
    "bulletBorderAlpha": 0.2, 
    "bulletAlpha": 0.8, 
    "lineAlpha": 0, 
    "fillAlphas": 0, 
    "valueField": "value2", 
    "xField": "x2", 
    "yField": "y2", 
    "maxBulletSize": 100 
}], 
"marginLeft": 46, 
"marginBottom": 35 

});

+0

Не могли бы вы показать нам свой код? Сделать скрипку? У меня нет времени, чтобы переделать ваш случай с царапины. – gerric

+0

http://jsfiddle.net/mier007/7gt3bad0/1/ это то, что у меня есть. Я не знаю, что я делаю что-то неправильно. ПОЖАЛУЙСТА, скажите, что вы можете мне помочь – Mari

+0

По некоторым причинам у меня проблемы с загрузкой источников amcharts в JSFiddle ... Это только для меня? Это ново для меня, вчера у меня не было проблем. – gerric

ответ

1

Хорошо, так что я получил для вас это Fiddle.
Для перемещения метки используется labelFunction. Поскольку labelFunction возвращает пустую строку, вы должны сделать это с помощью \u00a0 (пробел) или \n (новая строка). Таким образом, функция проверяет, имеют ли предыдущие (!) Точки одинаковые (!) Координаты.
Вы можете изменить его, чтобы проверить весь набор данных и посмотреть, не находится ли какой-либо datapoint.
Надеюсь, вы сможете с этим справиться. :)

+0

О, и прошу прощения. Тем временем мне пришлось сосредоточиться на этом. – gerric

+1

Большое вам спасибо. Хотел бы я проголосовать ......: D – Mari

+0

Привет, Геррик. не могли бы вы помочь мне снова. что я могу изменить, чтобы проверить, находятся ли метки рядом друг с другом. – Mari

Смежные вопросы