TypeScript appEvents.on方法代码示例

本文整理汇总了TypeScript中app/core/core.appEvents.on方法的典型用法代码示例。如果您正苦于以下问题：TypeScript appEvents.on方法的具体用法？TypeScript appEvents.on怎么用？TypeScript appEvents.on使用的例子？那么恭喜您, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在类app/core/core.appEvents的用法示例。

在下文中一共展示了appEvents.on方法的5个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于系统推荐出更棒的TypeScript代码示例。

示例1: function

    link: function(scope, elem) {
      var ctrl = scope.ctrl;
      var dashboard = ctrl.dashboard;
      var panel = ctrl.panel;
      var annotations = [];
      var data;
      var plot;
      var sortedSeries;
      var legendSideLastValue = null;
      var rootScope = scope.$root;
      var panelWidth = 0;
      var eventManager = new EventManager(ctrl, elem, popoverSrv);
      var thresholdManager = new ThresholdManager(ctrl);
      var tooltip = new GraphTooltip(elem, dashboard, scope, function() {
        return sortedSeries;
      });

      // panel events
      ctrl.events.on('panel-teardown', () => {
        thresholdManager = null;

        if (plot) {
          plot.destroy();
          plot = null;
        }
      });

      ctrl.events.on('render', function(renderData) {
        data = renderData || data;
        if (!data) {
          return;
        }
        annotations = ctrl.annotations || [];
        render_panel();
      });

      // global events
      appEvents.on('graph-hover', function(evt) {
        // ignore other graph hover events if shared tooltip is disabled
        if (!dashboard.sharedTooltipModeEnabled()) {
          return;
        }

        // ignore if we are the emitter
        if (!plot || evt.panel.id === panel.id || ctrl.otherPanelInFullscreenMode()) {
          return;
        }

        tooltip.show(evt.pos);
      }, scope);

      appEvents.on('graph-hover-clear', function(event, info) {
        if (plot) {
          tooltip.clear(plot);
        }
      }, scope);

      function getLegendHeight(panelHeight) {
        if (!panel.legend.show || panel.legend.rightSide) {
          return 0;
        }

        if (panel.legend.alignAsTable) {
          var legendSeries = _.filter(data, function(series) {
            return series.hideFromLegend(panel.legend) === false;
          });
          var total = 23 + (21 * legendSeries.length);
          return Math.min(total, Math.floor(panelHeight/2));
        } else {
          return 26;
        }
      }

      function setElementHeight() {
        try {
          var height = ctrl.height - getLegendHeight(ctrl.height);
          elem.css('height', height + 'px');

          return true;
        } catch (e) { // IE throws errors sometimes
          console.log(e);
          return false;
        }
      }

      function shouldAbortRender() {
        if (!data) {
          return true;
        }

        if (!setElementHeight()) { return true; }

        if (panelWidth === 0) {
          return true;
        }
      }

      function drawHook(plot) {
        // Update legend values
        var yaxis = plot.getYAxes();
//.........这里部分代码省略.........

开发者ID:casaria，项目名称:grafana-trillium-src-fork，代码行数:101，代码来源:graph.ts

示例2: link

export default function link(scope, elem, attrs, ctrl) {
  let data, timeRange, panel, heatmap;

  // $heatmap is JQuery object, but heatmap is D3
  let $heatmap = elem.find('.heatmap-panel');
  let tooltip = new HeatmapTooltip($heatmap, scope);

  let width,
    height,
    yScale,
    xScale,
    chartWidth,
    chartHeight,
    chartTop,
    chartBottom,
    yAxisWidth,
    xAxisHeight,
    cardPadding,
    cardRound,
    cardWidth,
    cardHeight,
    colorScale,
    opacityScale,
    mouseUpHandler;

  let selection = {
    active: false,
    x1: -1,
    x2: -1,
  };

  let padding = { left: 0, right: 0, top: 0, bottom: 0 },
    margin = { left: 25, right: 15, top: 10, bottom: 20 },
    dataRangeWidingFactor = DATA_RANGE_WIDING_FACTOR;

  ctrl.events.on('render', () => {
    render();
    ctrl.renderingCompleted();
  });

  function setElementHeight() {
    try {
      var height = ctrl.height || panel.height || ctrl.row.height;
      if (_.isString(height)) {
        height = parseInt(height.replace('px', ''), 10);
      }

      height -= panel.legend.show ? 28 : 11; // bottom padding and space for legend

      $heatmap.css('height', height + 'px');

      return true;
    } catch (e) {
      // IE throws errors sometimes
      return false;
    }
  }

  function getYAxisWidth(elem) {
    let axis_text = elem.selectAll('.axis-y text').nodes();
    let max_text_width = _.max(
      _.map(axis_text, text => {
        // Use SVG getBBox method
        return text.getBBox().width;
      })
    );

    return max_text_width;
  }

  function getXAxisHeight(elem) {
    let axis_line = elem.select('.axis-x line');
    if (!axis_line.empty()) {
      let axis_line_position = parseFloat(elem.select('.axis-x line').attr('y2'));
      let canvas_width = parseFloat(elem.attr('height'));
      return canvas_width - axis_line_position;
    } else {
      // Default height
      return 30;
    }
  }

  function addXAxis() {
    scope.xScale = xScale = d3
      .scaleTime()
      .domain([timeRange.from, timeRange.to])
      .range([0, chartWidth]);

    let ticks = chartWidth / DEFAULT_X_TICK_SIZE_PX;
    let grafanaTimeFormatter = ticksUtils.grafanaTimeFormat(ticks, timeRange.from, timeRange.to);
    let timeFormat;
    let dashboardTimeZone = ctrl.dashboard.getTimezone();
    if (dashboardTimeZone === 'utc') {
      timeFormat = d3.utcFormat(grafanaTimeFormatter);
    } else {
      timeFormat = d3.timeFormat(grafanaTimeFormatter);
    }

    let xAxis = d3
      .axisBottom(xScale)
//.........这里部分代码省略.........

开发者ID:fangjianfeng，项目名称:grafana，代码行数:101，代码来源:rendering.ts

示例3: function

    link: function(scope, elem) {
      var ctrl = scope.ctrl;
      var dashboard = ctrl.dashboard;
      var panel = ctrl.panel;
      var data;
      var annotations;
      var plot;
      var sortedSeries;
      var legendSideLastValue = null;
      var rootScope = scope.$root;
      var panelWidth = 0;
      var thresholdManager = new ThresholdManager(ctrl);
      var tooltip = new GraphTooltip(elem, dashboard, scope, function() {
        return sortedSeries;
      });

      // panel events
      ctrl.events.on('panel-teardown', () => {
        thresholdManager = null;

        if (plot) {
          plot.destroy();
          plot = null;
        }
      });

      ctrl.events.on('render', function(renderData) {
        data = renderData || data;
        if (!data) {
          return;
        }
        annotations = ctrl.annotations;
        render_panel();
      });

      // global events
      appEvents.on('graph-hover', function(evt) {
        // ignore other graph hover events if shared tooltip is disabled
        if (!dashboard.sharedTooltipModeEnabled()) {
          return;
        }

        // ignore if we are the emitter
        if (!plot || evt.panel.id === panel.id || ctrl.otherPanelInFullscreenMode()) {
          return;
        }

        tooltip.show(evt.pos);
      }, scope);

      appEvents.on('graph-hover-clear', function(event, info) {
        if (plot) {
          tooltip.clear(plot);
        }
      }, scope);

      function getLegendHeight(panelHeight) {
        if (!panel.legend.show || panel.legend.rightSide) {
          return 0;
        }

        if (panel.legend.alignAsTable) {
          var legendSeries = _.filter(data, function(series) {
            return series.hideFromLegend(panel.legend) === false;
          });
          var total = 23 + (21 * legendSeries.length);
          return Math.min(total, Math.floor(panelHeight/2));
        } else {
          return 26;
        }
      }

      function setElementHeight() {
        try {
          var height = ctrl.height - getLegendHeight(ctrl.height);
          elem.css('height', height + 'px');

          return true;
        } catch (e) { // IE throws errors sometimes
          console.log(e);
          return false;
        }
      }

      function shouldAbortRender() {
        if (!data) {
          return true;
        }

        if (!setElementHeight()) { return true; }

        if (panelWidth === 0) {
          return true;
        }
      }

      function drawHook(plot) {
        // Update legend values
        var yaxis = plot.getYAxes();
        for (var i = 0; i < data.length; i++) {
//.........这里部分代码省略.........

开发者ID:housecream，项目名称:server，代码行数:101，代码来源:graph.ts

示例4: function

    link: function(scope, elem) {
      var ctrl = scope.ctrl;
      var dashboard = ctrl.dashboard;
      var panel = ctrl.panel;
      var annotations = [];
      var data;
      var plot;
      var sortedSeries;
      var panelWidth = 0;
      var eventManager = new EventManager(ctrl);
      var thresholdManager = new ThresholdManager(ctrl);
      var tooltip = new GraphTooltip(elem, dashboard, scope, function() {
        return sortedSeries;
      });

      // panel events
      ctrl.events.on('panel-teardown', () => {
        thresholdManager = null;

        if (plot) {
          plot.destroy();
          plot = null;
        }
      });

      /**
       * Split graph rendering into two parts.
       * First, calculate series stats in buildFlotPairs() function. Then legend rendering started
       * (see ctrl.events.on('render') in legend.ts).
       * When legend is rendered it emits 'legend-rendering-complete' and graph rendered.
       */
      ctrl.events.on('render', renderData => {
        data = renderData || data;
        if (!data) {
          return;
        }
        annotations = ctrl.annotations || [];
        buildFlotPairs(data);
        ctrl.events.emit('render-legend');
      });

      ctrl.events.on('legend-rendering-complete', () => {
        render_panel();
      });

      // global events
      appEvents.on(
        'graph-hover',
        evt => {
          // ignore other graph hover events if shared tooltip is disabled
          if (!dashboard.sharedTooltipModeEnabled()) {
            return;
          }

          // ignore if we are the emitter
          if (!plot || evt.panel.id === panel.id || ctrl.otherPanelInFullscreenMode()) {
            return;
          }

          tooltip.show(evt.pos);
        },
        scope
      );

      appEvents.on(
        'graph-hover-clear',
        (event, info) => {
          if (plot) {
            tooltip.clear(plot);
          }
        },
        scope
      );

      function shouldAbortRender() {
        if (!data) {
          return true;
        }

        if (panelWidth === 0) {
          return true;
        }

        return false;
      }

      function drawHook(plot) {
        // add left axis labels
        if (panel.yaxes[0].label && panel.yaxes[0].show) {
          $("<div class='axisLabel left-yaxis-label flot-temp-elem'></div>")
            .text(panel.yaxes[0].label)
            .appendTo(elem);
        }

        // add right axis labels
        if (panel.yaxes[1].label && panel.yaxes[1].show) {
          $("<div class='axisLabel right-yaxis-label flot-temp-elem'></div>")
            .text(panel.yaxes[1].label)
            .appendTo(elem);
        }
//.........这里部分代码省略.........

开发者ID:arcolife，项目名称:grafana，代码行数:101，代码来源:graph.ts

示例5: link

export default function link(scope, elem, attrs, ctrl) {
  let data, timeRange, panel, heatmap;

  // $heatmap is JQuery object, but heatmap is D3
  let $heatmap = elem.find('.heatmap-panel');
  let tooltip = new HeatmapTooltip($heatmap, scope);

  let width, height,
      yScale, xScale,
      chartWidth, chartHeight,
      chartTop, chartBottom,
      yAxisWidth, xAxisHeight,
      cardPadding, cardRound,
      cardWidth, cardHeight,
      colorScale, opacityScale,
      mouseUpHandler;

  let selection = {
    active: false,
    x1: -1,
    x2: -1
  };

  let padding = {left: 0, right: 0, top: 0, bottom: 0},
      margin = {left: 25, right: 15, top: 10, bottom: 20},
      dataRangeWidingFactor = DATA_RANGE_WIDING_FACTOR;

  ctrl.events.on('render', () => {
    render();
    ctrl.renderingCompleted();
  });

  function setElementHeight() {
    try {
      var height = ctrl.height || panel.height || ctrl.row.height;
      if (_.isString(height)) {
        height = parseInt(height.replace('px', ''), 10);
      }

      height -= 5; // padding
      height -= panel.title ? 24 : 9; // subtract panel title bar

      $heatmap.css('height', height + 'px');

      return true;
    } catch (e) { // IE throws errors sometimes
      return false;
    }
  }

  function getYAxisWidth(elem) {
    let axis_text = elem.selectAll(".axis-y text").nodes();
    let max_text_width = _.max(_.map(axis_text, text => {
      let el = $(text);
      // Use JQuery outerWidth() to compute full element width
      return el.outerWidth();
    }));

    return max_text_width;
  }

  function getXAxisHeight(elem) {
    let axis_line = elem.select(".axis-x line");
    if (!axis_line.empty()) {
      let axis_line_position = parseFloat(elem.select(".axis-x line").attr("y2"));
      let canvas_width = parseFloat(elem.attr("height"));
      return canvas_width - axis_line_position;
    } else {
      // Default height
      return 30;
    }
  }

  function addXAxis() {
    scope.xScale = xScale = d3.scaleTime()
      .domain([timeRange.from, timeRange.to])
      .range([0, chartWidth]);

    let ticks = chartWidth / DEFAULT_X_TICK_SIZE_PX;
    let grafanaTimeFormatter = grafanaTimeFormat(ticks, timeRange.from, timeRange.to);

    let xAxis = d3.axisBottom(xScale)
      .ticks(ticks)
      .tickFormat(d3.timeFormat(grafanaTimeFormatter))
      .tickPadding(X_AXIS_TICK_PADDING)
      .tickSize(chartHeight);

    let posY = margin.top;
    let posX = yAxisWidth;
    heatmap.append("g")
      .attr("class", "axis axis-x")
      .attr("transform", "translate(" + posX + "," + posY + ")")
      .call(xAxis);

    // Remove horizontal line in the top of axis labels (called domain in d3)
    heatmap.select(".axis-x").select(".domain").remove();
  }

  function addYAxis() {
    let ticks = Math.ceil(chartHeight / DEFAULT_Y_TICK_SIZE_PX);
//.........这里部分代码省略.........

开发者ID:vaibhavinbayarea，项目名称:grafana，代码行数:101，代码来源:rendering.ts

注：本文中的app/core/core.appEvents.on方法示例由纯净天空整理自Github/MSDocs等开源代码及文档管理平台，相关代码片段筛选自各路编程大神贡献的开源项目，源码版权归原作者所有，传播和使用请参考对应项目的License；未经允许，请勿转载。