Unlock 30% off on Manual Testing Annual Plans this Holiday Season.

Copied to Clipboard!

How to use updateGraphZoom method in Best

Best JavaScript code snippet using best

ProjectActivityGraphs.js

Source:ProjectActivityGraphs.js

1/*2 * SonarQube3 * Copyright (C) 2009-2017 SonarSource SA4 * mailto:info AT sonarsource DOT com5 *6 * This program is free software; you can redistribute it and/or7 * modify it under the terms of the GNU Lesser General Public8 * License as published by the Free Software Foundation; either9 * version 3 of the License, or (at your option) any later version.10 *11 * This program is distributed in the hope that it will be useful,12 * but WITHOUT ANY WARRANTY; without even the implied warranty of13 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU14 * Lesser General Public License for more details.15 *16 * You should have received a copy of the GNU Lesser General Public License17 * along with this program; if not, write to the Free Software Foundation,18 * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.19 */20// @flow21import React from 'react';22import { debounce, findLast, maxBy, minBy, sortBy } from 'lodash';23import ProjectActivityGraphsHeader from './ProjectActivityGraphsHeader';24import GraphsZoom from './GraphsZoom';25import GraphsHistory from './GraphsHistory';26import { getCustomGraph, saveCustomGraph, saveGraph } from '../../../helpers/storage';27import {28  datesQueryChanged,29  generateSeries,30  getDisplayedHistoryMetrics,31  getSeriesMetricType,32  historyQueryChanged,33  isCustomGraph,34  splitSeriesInGraphs35} from '../utils';36import type { RawQuery } from '../../../helpers/query';37import type { Analysis, MeasureHistory, Metric, Query } from '../types';38import type { Serie } from '../../../components/charts/AdvancedTimeline';39type Props = {40  analyses: Array<Analysis>,41  leakPeriodDate: Date,42  loading: boolean,43  measuresHistory: Array<MeasureHistory>,44  metrics: Array<Metric>,45  query: Query,46  updateQuery: RawQuery => void47};48type State = {49  graphStartDate: ?Date,50  graphEndDate: ?Date,51  series: Array<Serie>,52  graphs: Array<Array<Serie>>53};54const MAX_GRAPH_NB = 2;55const MAX_SERIES_PER_GRAPH = 3;56export default class ProjectActivityGraphs extends React.PureComponent {57  props: Props;58  state: State;59  constructor(props: Props) {60    super(props);61    const series = generateSeries(62      props.measuresHistory,63      props.query.graph,64      props.metrics,65      getDisplayedHistoryMetrics(props.query.graph, props.query.customMetrics)66    );67    this.state = {68      series,69      graphs: splitSeriesInGraphs(series, MAX_GRAPH_NB, MAX_SERIES_PER_GRAPH),70      ...this.getStateZoomDates(null, props, series)71    };72    this.updateQueryDateRange = debounce(this.updateQueryDateRange, 500);73  }74  componentWillReceiveProps(nextProps: Props) {75    let newSeries;76    let newGraphs;77    if (78      nextProps.measuresHistory !== this.props.measuresHistory ||79      historyQueryChanged(this.props.query, nextProps.query)80    ) {81      newSeries = generateSeries(82        nextProps.measuresHistory,83        nextProps.query.graph,84        nextProps.metrics,85        getDisplayedHistoryMetrics(nextProps.query.graph, nextProps.query.customMetrics)86      );87      newGraphs = splitSeriesInGraphs(newSeries, MAX_GRAPH_NB, MAX_SERIES_PER_GRAPH);88    }89    const newDates = this.getStateZoomDates(this.props, nextProps, newSeries);90    if (newSeries || newDates) {91      let newState = {};92      if (newSeries) {93        newState.series = newSeries;94        newState.graphs = newGraphs;95      }96      if (newDates) {97        newState = { ...newState, ...newDates };98      }99      this.setState(newState);100    }101  }102  getStateZoomDates = (103    props: ?Props,104    nextProps: Props,105    newSeries: ?Array<Serie>106  ): ?{ graphEndDate: ?Date, graphStartDate: ?Date } => {107    const newDates = { from: nextProps.query.from || null, to: nextProps.query.to || null };108    if (!props || datesQueryChanged(props.query, nextProps.query)) {109      return { graphEndDate: newDates.to, graphStartDate: newDates.from };110    }111    if (newDates.to == null && newDates.from == null && newSeries != null) {112      const series = newSeries ? newSeries : this.state.series;113      const firstValid = minBy(series.map(serie => serie.data.find(p => p.y || p.y === 0)), 'x');114      const lastValid = maxBy(115        series.map(serie => findLast(serie.data, p => p.y || p.y === 0)),116        'x'117      );118      return {119        graphEndDate: lastValid ? lastValid.x : newDates.to,120        graphStartDate: firstValid ? firstValid.x : newDates.from121      };122    }123  };124  getMetricsTypeFilter = (): ?Array<string> => {125    if (this.state.graphs.length < MAX_GRAPH_NB) {126      return null;127    }128    return this.state.graphs129      .filter(graph => graph.length < MAX_SERIES_PER_GRAPH)130      .map(graph => graph[0].type);131  };132  addCustomMetric = (metric: string) => {133    const customMetrics = [...this.props.query.customMetrics, metric];134    saveCustomGraph(customMetrics);135    this.props.updateQuery({ customMetrics });136  };137  removeCustomMetric = (removedMetric: string) => {138    const customMetrics = this.props.query.customMetrics.filter(metric => metric !== removedMetric);139    saveCustomGraph(customMetrics);140    this.props.updateQuery({ customMetrics });141  };142  updateGraph = (graph: string) => {143    saveGraph(graph);144    if (isCustomGraph(graph) && this.props.query.customMetrics.length <= 0) {145      this.props.updateQuery({ graph, customMetrics: getCustomGraph() });146    } else {147      this.props.updateQuery({ graph, customMetrics: [] });148    }149  };150  updateGraphZoom = (graphStartDate: ?Date, graphEndDate: ?Date) => {151    if (graphEndDate != null && graphStartDate != null) {152      const msDiff = Math.abs(graphEndDate.valueOf() - graphStartDate.valueOf());153      // 12 hours minimum between the two dates154      if (msDiff < 1000 * 60 * 60 * 12) {155        return;156      }157    }158    this.setState({ graphStartDate, graphEndDate });159    this.updateQueryDateRange([graphStartDate, graphEndDate]);160  };161  updateSelectedDate = (selectedDate: ?Date) => this.props.updateQuery({ selectedDate });162  updateQueryDateRange = (dates: Array<?Date>) => {163    if (dates[0] == null || dates[1] == null) {164      this.props.updateQuery({ from: dates[0], to: dates[1] });165    } else {166      const sortedDates = sortBy(dates);167      this.props.updateQuery({ from: sortedDates[0], to: sortedDates[1] });168    }169  };170  render() {171    const { leakPeriodDate, loading, metrics, query } = this.props;172    const { graphEndDate, graphStartDate, series } = this.state;173    return (174      <div className="project-activity-layout-page-main-inner boxed-group boxed-group-inner">175        <ProjectActivityGraphsHeader176          addCustomMetric={this.addCustomMetric}177          graph={query.graph}178          metrics={metrics}179          metricsTypeFilter={this.getMetricsTypeFilter()}180          selectedMetrics={this.props.query.customMetrics}181          updateGraph={this.updateGraph}182        />183        <GraphsHistory184          analyses={this.props.analyses}185          eventFilter={query.category}186          graph={query.graph}187          graphs={this.state.graphs}188          graphEndDate={graphEndDate}189          graphStartDate={graphStartDate}190          leakPeriodDate={leakPeriodDate}191          loading={loading}192          measuresHistory={this.props.measuresHistory}193          removeCustomMetric={this.removeCustomMetric}194          selectedDate={this.props.query.selectedDate}195          series={series}196          updateGraphZoom={this.updateGraphZoom}197          updateSelectedDate={this.updateSelectedDate}198        />199        <GraphsZoom200          graphEndDate={graphEndDate}201          graphStartDate={graphStartDate}202          leakPeriodDate={leakPeriodDate}203          loading={loading}204          metricsType={getSeriesMetricType(series)}205          series={series}206          showAreas={['coverage', 'duplications'].includes(query.graph)}207          updateGraphZoom={this.updateGraphZoom}208        />209      </div>210    );211  }...

graphDragMoveEvent.js

Source:graphDragMoveEvent.js

...60          options.xmin = newZXmin;61          options.xmax = newZXmax;62          options.ymin = newZYmin;63          options.ymax = newZYmax;64          updateGraphZoom(gphname, options);65          eval(graphData[gphname].runFunctionDuringDrag);66        } else if (graphData[gphname].dragDirection == 'onlyY') {67          options = {};68          options.ymin = newZYmin;69          options.ymax = newZYmax;70          updateGraphZoom(gphname, options);71          eval(graphData[gphname].runFunctionDuringDrag);72        } else if (graphData[gphname].dragDirection == 'onlyX') {73          options = {};74          options.xmin = newZXmin;75          options.xmax = newZXmax;76          updateGraphZoom(gphname, options);77          eval(graphData[gphname].runFunctionDuringDrag);78        }79      }80    }81  }...

Using AI Code Generation

1var graph = new BestFitGraph();2graph.updateGraphZoom(0.5);3var graph = new BestFitGraph();4graph.updateGraphZoom(0.5);5var graph = new BestFitGraph();6graph.updateGraphZoom(0.5);7var graph = new BestFitGraph();8graph.updateGraphZoom(0.5);9var graph = new BestFitGraph();10graph.updateGraphZoom(0.5);11var graph = new BestFitGraph();12graph.updateGraphZoom(0.5);13var graph = new BestFitGraph();14graph.updateGraphZoom(0.5);15var graph = new BestFitGraph();16graph.updateGraphZoom(0.5);17var graph = new BestFitGraph();18graph.updateGraphZoom(0.5);19var graph = new BestFitGraph();20graph.updateGraphZoom(0.5);21var graph = new BestFitGraph();22graph.updateGraphZoom(0.5);23var graph = new BestFitGraph();24graph.updateGraphZoom(0.5);25var graph = new BestFitGraph();26graph.updateGraphZoom(0.5);27var graph = new BestFitGraph();28graph.updateGraphZoom(0.5);

Using AI Code Generation

1import React from 'react';2import BestFitGraph from 'best-fit-graph';3import ReactDOM from 'react-dom';4class Test extends React.Component {5  constructor(props) {6    super(props);7    this.state = {8        {x: 1, y: 2},9        {x: 2, y: 3},10        {x: 3, y: 4},11        {x: 4, y: 5},12        {x: 5, y: 6}13    };14  }15  updateGraphZoom() {16    this.refs.graph.updateGraphZoom(0, 3, 1, 4);17  }18  render() {19    return (20          data={this.state.data}21          width={500}22          height={500}23          padding={40}24          xLabelOffset={25}25          yLabelOffset={25}26          xLabelRotate={0}27          yLabelRotate={0}28          xLabelFontSize={12}29          yLabelFontSize={12}30          xTickSize={5}31          yTickSize={5}32          xTickFontSize={12}33          yTickFontSize={12}34          xTickLabelOffset={10}35          yTickLabelOffset={10}36          xTickLabelRotate={0}37          yTickLabelRotate={0}38          xTickFormat={x => x}39          yTickFormat={y => y}40          xTickInterval={1}41          yTickInterval={1}42          xMin={1}43          xMax={5}44          yMin={2}45          yMax={6}46          xMinRange={1}47          xMaxRange={5}48          yMinRange={2}49          yMaxRange={6}50          xMinZoom={1}51          xMaxZoom={5}52          yMinZoom={2}53          yMaxZoom={6}54          xMinZoomRange={1}55          xMaxZoomRange={5}56          yMinZoomRange={2}57          yMaxZoomRange={6}58          xScalePadding={0}

Using AI Code Generation

1var graphView = Ti.UI.createView({2});3$.win.add(graphView);4$.win.open();5var graphView = Alloy.createWidget('com.bestfit.graph');6graphView.init({7});8$.win.add(graphView.getView());9$.win.open();10function init(args) {11    $.view = Ti.UI.createView(args);12    $.view.addEventListener('postlayout', function(e) {13    });14}15function init(args) {16    $.view = Ti.UI.createView(args);17    $.view.addEventListener('postlayout', function(e) {18    });19}20function init(args) {21    $.view = Ti.UI.createView(args);22    $.view.addEventListener('postlayout', function(e) {23    });24}25function init(args) {26    $.view = Ti.UI.createView(args);27    $.view.addEventListener('postlayout', function(e) {28    });29}30function init(args) {31    $.view = Ti.UI.createView(args);32    $.view.addEventListener('postlayout', function(e) {33    });34}35function init(args) {36    $.view = Ti.UI.createView(args);37    $.view.addEventListener('postlayout', function(e) {38    });39}40function init(args) {41    $.view = Ti.UI.createView(args);42    $.view.addEventListener('postlayout', function(e) {43    });44}45function init(args) {46    $.view = Ti.UI.createView(args);

Using AI Code Generation

1var graph = new BestFitGraph();2graph.updateGraphZoom(0.5, 0.5, 0.5, 0.5);3var BestFitGraph = function () {4    this.updateGraphZoom = function (x, y, w, h) {5        console.log("BestFitGraph.updateGraphZoom");6    }7}8var BestFitGraph = function () {9    this.updateGraphZoom = function (x, y, w, h) {10        console.log("BestFitGraph.updateGraphZoom");11    }12}13var BestFitGraph = function () {14    this.updateGraphZoom = function (x, y, w, h) {15        console.log("BestFitGraph.updateGraphZoom");16    }17}18var BestFitGraph = function () {19    this.updateGraphZoom = function (x, y, w, h) {20        console.log("BestFitGraph.updateGraphZoom");21    }22}23var BestFitGraph = function () {24    this.updateGraphZoom = function (x, y, w, h) {25        console.log("BestFitGraph.updateGraphZoom");26    }27}28var BestFitGraph = function () {29    this.updateGraphZoom = function (x, y, w, h) {30        console.log("BestFitGraph.updateGraphZoom");31    }32}33var BestFitGraph = function () {34    this.updateGraphZoom = function (x, y, w, h) {35        console.log("BestFitGraph.updateGraphZoom");36    }37}38var BestFitGraph = function () {39    this.updateGraphZoom = function (x, y, w, h) {40        console.log("BestFitGraph.updateGraphZoom");41    }42}

Using AI Code Generation

1var BestFitGraph = require('best-fit-graph');2var graph = new BestFitGraph({3    canvas: document.getElementById('myCanvas'),4});5graph.drawLine(0, 0, 10, 10);6graph.updateGraphZoom(5, 5, 2, 2);7graph.updateGraphZoom(5, 5, 0.5, 0.5);8graph.updateGraphZoom(5, 5, 0.25, 0.25);9graph.updateGraphZoom(5, 5, 4, 4);10graph.updateGraphZoom(5, 5, 8, 8);11graph.updateGraphZoom(5, 5, 16, 16);12graph.updateGraphZoom(5, 5, 0.125, 0.125);13graph.updateGraphZoom(5, 5, 0.0625, 0.0625);14graph.updateGraphZoom(5, 5, 0.03125, 0.03125);15graph.updateGraphZoom(5, 5, 0.015625, 0.015625);16graph.updateGraphZoom(5, 5, 0.0078125, 0.0078125);17graph.updateGraphZoom(5, 5, 0.00390625, 0.00390625);18graph.updateGraphZoom(5, 5, 0.001953125, 0.001953125);19graph.updateGraphZoom(5, 5, 0.0009765625, 0.0009765625);20graph.updateGraphZoom(5, 5, 0.00048828125, 0.00048828125);21graph.updateGraphZoom(5, 5, 0.000244140

Using AI Code Generation

1var myGraph = new BestFitGraph();2myGraph.updateGraphZoom(0, 10, 0, 10);3function BestFitGraph() {4    this.updateGraphZoom = function (startX, endX, startY, endY) {5    };6}7function BestFitGraph() {8    this.updateGraphZoom = function (startX, endX, startY, endY) {9    };10}11function BestFitGraph() {12    this.updateGraphZoom = function (startX, endX, startY, endY) {13    };14}15function BestFitGraph() {16    this.updateGraphZoom = function (startX, endX, startY, endY) {17    };18}19function BestFitGraph() {20    this.updateGraphZoom = function (startX, endX, startY, endY) {21    };22}23function BestFitGraph() {24    this.updateGraphZoom = function (startX, endX, startY, endY) {25    };26}27function BestFitGraph() {28    this.updateGraphZoom = function (startX, endX, startY, endY) {29    };30}31function BestFitGraph() {32    this.updateGraphZoom = function (startX, endX, startY, endY) {33    };34}35function BestFitGraph() {36    this.updateGraphZoom = function (startX, endX, startY, endY) {37    };38}39function BestFitGraph() {40    this.updateGraphZoom = function (startX, endX, startY, endY) {41    };42}43function BestFitGraph() {

Using AI Code Generation

1var graph = new BestFitGraphView();2graph.updateGraphZoom(0.5);3updateGraphZoom: function (zoomFactor) {4    var graph = this.graph;5    var graphWidth = graph.width;6    var graphHeight = graph.height;7    var graphCenterX = graphWidth / 2;8    var graphCenterY = graphHeight / 2;9    var newWidth = graphWidth * zoomFactor;10    var newHeight = graphHeight * zoomFactor;11    var newX = graphCenterX - (newWidth / 2);12    var newY = graphCenterY - (newHeight / 2);13    graph.setFrame(newX, newY, newWidth, newHeight);14}15var graph = new BestFitGraphView();16graph.updateGraphZoom(0.5);17updateGraphZoom: function (zoomFactor) {18    var graph = this.graph;19    var graphWidth = graph.width;20    var graphHeight = graph.height;21    var graphCenterX = graphWidth / 2;22    var graphCenterY = graphHeight / 2;23    var newWidth = graphWidth * zoomFactor;24    var newHeight = graphHeight * zoomFactor;25    var newX = graphCenterX - (newWidth / 2);26    var newY = graphCenterY - (newHeight / 2);27    graph.setFrame(newX, newY, newWidth, newHeight);28}

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.