Forum Replies Created by Vishwas R

Viewing 15 posts - 1,531 through 1,545 (of 1,621 total)
  • in reply to: Export Chart as Image/Get chart data as Base64 format #11468

    Sathya,

    You can change save.download = 'CanvasJS.png'; in first example to your desired name. Here CanvasJS.png is the image-file name. And in the second example, you can use exportFileName to set image-file name.

    Download location setting is a part of browser setting, it varies from browser-to-browser. You can change it under browser settings. Check these links to change/manage download location in chrome and Firefox.


    Vishwas R
    Team CanvasJS

    in reply to: Export Chart as Image/Get chart data as Base64 format #11465

    Sathya,

    You can auto-download chart as image with the help of toDataURL. toDataURL lets you get the base64 image data, which you can save as a file after chart is rendered. Below is the code-snippet for the same.

    $.when(chart.render()).then(function(){						
      var canvas = $("#chartContainer .canvasjs-chart-canvas").get(0);
      var dataURL = canvas.toDataURL('image/png');              
      //console.log(dataURL);
      //Save Image creating an element and clicking it
      var save = document.createElement('a');
      save.href = dataURL;
      save.download = 'CanvasJS.png';//Save as CanvasJS.png-File Name
      var event = document.createEvent("MouseEvents");
      event.initMouseEvent(
        "click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null
      );
      save.dispatchEvent(event);
    });

    Please take a look at this JSFiddle for an example on the same.

    Alternately, you can achieve same by setting exportEnabled to true and auto-clicking the link of format of image you like to save. Please find the code-snippet for this logic below.
    $('.canvasjs-chart-toolbar div>:nth-child(2)').click();
    Please take a look at this JSFiddle for complete code on this approach.

    CanvasJS Export as Image


    Vishwas R
    Team CanvasJS

    in reply to: Allow for a fixed size of pie charts #11463

    You can use radius to make pie chart of fixed-size/radius irrespective of number of labels. Here is the updated jsfiddle.

    As we checked your fiddle, you are using an older version of CanvasJS (v1.7.0). Kindly use the latest version of CanvasJS and stay updated with all the features and properties available.

    Pie Chart with Fixed Radius

    in reply to: Lock size of graph in relation to axis text #11452

    Mats,

    As of now, feature to set reserved width for the axisX label is not available. But you can set the maximum allowed width for labels using labelMaxWidth.

    in reply to: step Line Chart with time series #11437

    Sathya,

    You can use valueFormatString to format date to show in 12Hours format. Check this example.

    in reply to: Change part of the colored area in splineArea chart #11428

    You can use Range Spline Area chart along with minimum to do so, check this example. And also you can change the code in our library (canvasjs.js), you can look into renderRangeSplineArea to modify Spline-Area chart.

    in reply to: Change format date #11424

    Kindly use any of the following 4 date-formats.
    1. ISO Dates (YYYY-MM-DD or YYYY-MM or YYYY-MM-DDTHH:MM:SS)
    2. Long Dates (MMM DD YYYY)
    3. Short Dates (MM/DD/YYYY or YYYY/MM/DD)
    4. Full Format (full JavaScript format Ex: new Date(“Wed Mar 25 2015 09:56:24 GMT+0100 (W. Europe Standard Time)”);

    Please refer this page for Date-Formats in JavaScript.

    in reply to: Change part of the colored area in splineArea chart #11420

    Sorry this feature is not available, as of now.

    in reply to: Edges #11419

    Thanks for the jsfiddle. The behavior has been designed the way so that the marker won’t go out of plot-area and overlap other elements like labels, title etc.

    We observed that you are setting minimum and maximum to exact value of minimum/maximum of dataPoint values, which clips the markers. You can overcome this by setting minimum and maximum of axisY in accordance with the dataPoint values. Check this jsfiddle.

    in reply to: Change format date #11417

    Both formats works fine across browsers like Firefox, all chromium based except Internet Explorer as new Date(“Sun 02 03 2013 22:04:09”) is not a standard JavaScript DateTime format. Its suggested to use standard JavaScript DateTime formats to make it work properly across all browsers.

    in reply to: Collection data with Ajax #11413

    Saimeera,

    We observed that you are using dateTime over axis-X. Kindly refer this link for JavaScript date-time object.

    Here is the working JFiddle.

    Rendering Chart from External JSON File (DateTime over X-Axis)

    —-
    Vishwas R
    Team CanvasJS

    in reply to: Candlestick + Volume (line chart) in one chart? #11411

    Budihar,

    As of now its not possible to share common axis across multiple charts. But you can use two separate charts one below the other to achieve this as show in this example.

    in reply to: Candlestick + Volume (line chart) in one chart? #11405

    Budihar,

    Yes it’s possible to combine candlestick chart with any other chart types except Doughnut, Pie, all Bar charts. Here is an example.

    in reply to: Change format date #11404

    We observe that both formats are working fine.

    { x: new Date("Sun 02 03 2013 22:04:09"), y: 26},
    { x: new Date("Sun Feb 03 2013 22:04:09"), y: 26}
    

    Here is the screenshot of the same.
    Can you please create a jsfiddle with the issue, so that we can look into it and resolve.

    in reply to: Distance between two columns in the column chart #11384

    Teresa,

    You can use dataPointWidth to increase/decrease the width of dataPoint (column in your case) which is nothing but reducing/increasing the gap between columns.

Viewing 15 posts - 1,531 through 1,545 (of 1,621 total)