jQplot OHLC Renderer - наведение мышки для баров

0

Я только что реализовал диаграмму с использованием jQplot- плагина. Я использовал OHLCRenderer как средство визуализации, и диаграмма выглядит так.

Изображение 174551

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

Это код

var catOHLC = [
    [1, 10, 6.5, 10, 10],
[2, 1.2, 5, 1.2, 1.2],
[3, 8, 10, 8, 8],
];

var catOHLC1 = [
    [1, 0, 5, 0, 0]

];

var ticks = ['A', 'B', 'C', 'D', 'E'];
var ticks2 = [12, 11, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1, 0];
plot4 = $.jqplot('chart4', [catOHLC, catOHLC1], {
    stackSeries: true,
  axes: {
      xaxis: {
          renderer:$.jqplot.CategoryAxisRenderer,
          ticks:ticks
      },
      yaxis: {
          tickRenderer: $.jqplot.CanvasAxisTickRenderer,
          ticks: ticks2,
          max: 24,
          min: 0
      }
  },
  series: [{ renderer: $.jqplot.OHLCRenderer, rendererOptions: { candleStick: false, tickLength: 0, lineWidth: 10 } },
  { renderer: $.jqplot.OHLCRenderer, rendererOptions: { candleStick: false, tickLength: 0, lineWidth: 10 } }],
});});
Теги:
jqplot

1 ответ

1
Лучший ответ

Я использовал плагин jqplot highlighter, чтобы сделать эту работу со слегка измененной версией вашего кода. Вот jsfiddle, и код ниже. Обратите внимание, что это довольно похоже на пример на http://www.jqplot.com/tests/candlestick-charts.php.

plot4 = $.jqplot('chart4', [catOHLC, catOHLC1], {

    series: [{
        renderer: $.jqplot.OHLCRenderer,
        rendererOptions: {
            tickLength: 4,
            lineWidth: 10
        }
    }, {
        renderer: $.jqplot.OHLCRenderer,
        rendererOptions: {
            tickLength: 4,
            lineWidth: 10
        }
    }],

    highlighter: {
        show: true,
        showMarker: false,
        tooltipAxes: 'xy',
        yvalues: 4,
        formatString: '<table class="jqplot-highlighter"> \
  <tr><td>x:</td><td>%s</td></tr> \
  <tr><td>open:</td><td>%s</td></tr> \
  <tr><td>hi:</td><td>%s</td></tr> \
  <tr><td>low:</td><td>%s</td></tr> \
  <tr><td>close:</td><td>%s</td></tr></table>'
    }
});
  • 0
    Нет, это не работает. Я добавил код в вопросе. Можете ли вы проверить.
  • 0
    Перепишите ответ, пожалуйста, попробуйте сейчас.
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню