Forum Replies Created by Vishwas R

Viewing 15 posts - 496 through 510 (of 1,601 total)
  • in reply to: Padding Support for Chart Legend #26871

    @swapnilv007,

    Padding is not available in legend, as of now. Are you looking for space between legend-marker and legend-text? If so you can achieve it by setting markerMargin property. If not can you kindly share some pictorial representation or an example of your requirements so that we can understand it better and help you out?


    Vishwas R
    Team CanvasJS

    in reply to: How to add 12 months in column chart #26870

    @hpriyalal,

    Labels are shown at every interval of the axis. To avoid overlapping, chart skips alternative labels which can be overridden by setting interval property. Incase of date-time axis, you may need to set intervalType along with interval according to your data, please refer documentation for more info and live examples.

    If this doesn’t solve the issue you are facing, kindly create JSFiddle reproducing the issue and share it with us so that we can look into the code, understand the scenario better and help you out.


    Vishwas R
    Team CanvasJS

    in reply to: Canvas Chart #26857

    @kshv195,

    Can you kindly create a JSFiddle reproducing the issue you are facing and share it with us so that we can look into the code, understand the scenario better and help you out?

    From what we have observed, sometimes things get delayed mostly when we are not able to reproduce the issue or not able to understand the exact requirements or the solution that we provide may not work properly due to the variation in chart-options being used by you and us.

    Having a JSFiddle helps us in figuring out the issue and many a times we can just edit your code on JSFiddle to fix the issue right-away.


    Vishwas R
    Team CanvasJS

    in reply to: how can i include my form post values to datapoints #26856

    @redchilly2095,

    Please take a look at this JSFiddle for an example on rendering chart with data from a HTML form. Also please refer this documentation page for step-by-step tutorial on rendering chart with data from user input.


    Vishwas R
    Team CanvasJS

    in reply to: How to render histograms #26855

    @nancy-gale,

    When the chart is zoomed, you can find whether a dataPoint is within the viewport range or outside with the help of rangeChanged event.

    rangeChanged: function(e) {
      var dpsWithinViewport = 0;
      for(var j = 0; j < e.chart.data[0].dataPoints.length; j++) {
        var dataPoint = e.chart.data[0].dataPoints[j];
        if(dataPoint.x >= e.axisX[0].viewportMinimum && dataPoint.x <= e.axisX[0].viewportMaximum) {
          dpsWithinViewport++;
        }
      }
      if(e.trigger === "reset")
        updateDataPointWidth(e.chart, e.chart.data[0].dataPoints.length);
      else
        updateDataPointWidth(e.chart, dpsWithinViewport);	
    }

    Please take a look at this JSFiddle for nearest possible solution to set the dataPointWidth by finding the number of dataPoints within the viewport range.

    https://canvasjs.com/wp-content/uploads/2021/03/histogram-using-column-chart.png


    Vishwas R
    Team CanvasJS

    in reply to: How to force all y-axis data point labels to be visible? #26848

    Adam Griffiths,

    Labels are shown at every interval of the axis. To avoid overlapping, chart skips alternative labels which can be overridden by setting interval property. Incase of date-time axis, you may need to set intervalType along with interval according to your data, please refer documentation for more info and live examples.


    Vishwas R
    Team CanvasJS

    in reply to: Toggle Pan/Zoom in react #26772

    @offwhtie,

    Sorry, it’s not possible to switch to pan mode by default as of now. However you can perform a click programmatically to achieve – as you have mentioned. Please take a look at this JSFiddle.


    Vishwas R
    Team CanvasJS

    in reply to: Method call for Zoom / pan Function in Canvas Js #26734

    @santhoshnarendra,

    You can perform button click programmatically to switch to pan mode by default & hide the zoom/pan button using CSS to do so. Below is the code-snippet for the same.

    -----CSS----
    .canvasjs-chart-toolbar> button:first-child {
      display: none !important;
    }
    ----JS----
    var parentElement = document.getElementsByClassName("canvasjs-chart-toolbar");
    var childElement = document.getElementsByTagName("button");
    if(childElement[0].getAttribute("state") === "pan"){
      childElement[0].click();
    }

    Please take a look at this JSFiddle for complete code.


    Vishwas R
    Team CanvasJS

    in reply to: Add title with parameter when calling php page #26735

    @woeperbe,

    Changing text: $title to text:<?php $title ?> should work fine in your case.

    If the issue still persists, kindly share sample project along with sample data over Google-Drive or Onedrive so that we can run it locally at our end to understand the scenario better and help you resolve.


    Vishwas R
    Team CanvasJS

    in reply to: Separate only one partition #26733

    @amitkushwaha1710,

    You can keep only one slice / segment exploded with the help of exploded property as shown in this JSFiddle.


    Vishwas R
    Team CanvasJS

    in reply to: Canvas bar chart shows milestone #26732

    @avinash,

    You can combine error chart with column / bar chart to achieve your requirements. Please take a look at this JSFiddle.


    Vishwas R
    Team CanvasJS

    in reply to: Method call for Zoom / pan Function in Canvas Js #26687

    @santhoshnarendra,

    Setting zoomEnabled property to true will show zoom / pan & reset buttons, once the chart is zoomed.
    zoomEnabled: true,
    Please take a look at this updated JSFiddle.


    Vishwas R
    Team CanvasJS

    in reply to: Last day of month doubles up as 1st of next #26684

    @tyler,

    In JavaScript month index starts from 0(January) and ends at 11(December) because of which 8/31 (31st of September) is considered as 9/1 (1st of October). Please refer this article for more information.


    Vishwas R
    Team CanvasJS

    in reply to: Method call for Zoom / pan Function in Canvas Js #26683

    @santhoshnarendra,

    Are you looking for programatically zooming / panning the chart? If so you can achieve it by changing viewportMinimum and viewportMaximum. Please take a look at this JSFiddle for the same.
    Zooming Chart using Mouse Wheel


    Vishwas R
    Team CanvasJS

    in reply to: Can we move the position of the zoom and pan buttons #26642

    @operationsteam,

    You can customize the position of zoom / pan button by changing the CSS of ‘canvasjs-chart-toolbar’ class. Please take a look at this JSFiddle for an example where zoom / pan buttons are positioned to the top-left of the chart.


    Vishwas R
    Team CanvasJS

Viewing 15 posts - 496 through 510 (of 1,601 total)