jquery jqplot jqplot.highlighter, отображающий название серии в диаграмме серии multy - PullRequest
Новая
       0

jquery jqplot jqplot.highlighter, отображающий название серии в диаграмме серии multy

3 голосов
/ 26 декабря 2011

У меня есть многосерийная диаграмма, и я хочу выделить не только x и y координаты точки, но и имя series.

Возможно ли это?

Ответы [ 4 ]

5 голосов
/ 08 января 2014

Самый простой способ, который я нашел, это сделать так: 

$.jqplot('chart-id', values, {
    series: [ 
              {
                  highlighter: { formatString: 'serie1: %s, %s'}
              },
              ...
            ]
     axes : {
         xaxis:{
             renderer:$.jqplot.DateAxisRenderer,
             tickOptions:{
                 formatString:'%b %#d'
             }
         },
         yaxis:{
              tickOptions:{
                  formatString:'%.2f'
              }
         }
     },
     highlighter: {
         show: true
     }
  });
1 голос
/ 10 июня 2016

Решение Жюльена Гренье хорошо, но это головная боль, когда вы не знаете название своей серии. Например, автоматически связывается с БД. Нет необходимости изменять jqplot.highlighter.js. Это не задокументировано, но у вас есть tooltipContentEditor 

 highlighter: {
                // you can have anything here
                 tooltipFormatString: '<b><i><span style="color:red;">%.2f</span></i></b>',
                 tooltipContentEditor: function (str, seriesIndex, pointIndex, plot) {
                 //the str is the ready string from tooltipFormatString
                 //depending on how do you give the series to the chart you can use plot.legend.labels[seriesIndex] or plot.series[seriesIndex].label
                     return '<b><span style="color:blue;">' + plot.legend.labels[seriesIndex] + ': </span></b>' + str;
                 }
             },
1 голос
/ 12 марта 2012

Мне нужна была такая же функциональность.Но я предпочел не менять сценарии jqplot самостоятельно, и я использовал решение, представленное здесь .

Это довольно просто.Преимущество этого решения заключается в том, что вы можете изменять содержимое всплывающей подсказки без изменения сценария jqplot.Таким образом, ваш код не зависит от будущих обновлений.

Например, см. Ниже мое решение, построенное с расширением вышеупомянутый пример : 

function myMove (ev, gridpos, datapos, neighbor, plot) {
    if (neighbor == null ) {
        $('#myToolTip').fadeOut();
    }
    if (neighbor != null ) {     
        var seriesName = plot.series[neighbor.seriesIndex].label;
        var x = neighbor.data[0];
        var y = neighbor.data[1];
        if(!lastNeighbor || (lastNeighbor.seriesIndex !== neighbor.seriesIndex || lastNeighbor.pointIndex !== neighbor.pointIndex)){
            var myText = "Series name="+seriesName+"<br/>Value="+y;
            $('#myToolTip').html(myText).css({left:gridpos.x, top:gridpos.y}).fadeIn();
        }
    }
    lastNeighbor = neighbor;
}
var lastNeighbor = null;
1 голос
/ 28 февраля 2012

Мне нужна была такая же функциональность. Я нашел этот пост

http://groups.google.com/group/jqplot-users/browse_thread/thread/edcbe2a30ef5052b/622626628106cdc6?lnk=gst&q=series+name+in+highlighter#622626628106cdc6

Прочитав это и изучив код, я внес изменения в plugins / jqplot.highlighter.js, строка 292 (v1.0.0b2_r947) Это блок case 'xy' из switch (opts.tooltipAxes).

из 

str = xstr;

в 

str = series.label + ": ";
str += xstr;

Теперь имя моей серии отображается во всплывающих подсказках к точкам данных :) Возможно, вы могли бы расширить это, добавив новый переключатель в параметры серии, но я хотел, чтобы он был включен постоянно.

...