FORUMS

Select any forum below to ask question

Home › Forums › Report Bugs › graph duplication

graph duplication

Viewing 7 posts - 1 through 7 (of 7 total)
  • June 8, 2016 at 2:19 pm #11323

    praveen67084

    I make a graph and it works perfectly but when i placed the same graph in another place in a same page then its not working, means graph show only at one place not both place; both divs are placed in same web page. Please help me as soon as possible. Thank you

    June 8, 2016 at 2:55 pm #11324

    Sanjoy

    Praveen,

    We are unable to find the issue. Can you please create a fiddle. So, that we can look into it.

    June 9, 2016 at 10:03 am #11325

    praveen67084

    i don’t know how to create fiddle so i paste my code here. Please check this and reply as soon as possible. My code is….
    Problem is it show only one graph but i want the same graph at two places.

    <!DOCTYPE HTML>
    <html>
    <head>
    <script type=”text/javascript” src=”js/canvasjs.min.js”></script>
    <script type=”text/javascript”>
    window.onload = function () {
    CanvasJS.addColorSet(“blackline”,
    [//colorSet Array
    “#000000”
    ]);
    var chart = new CanvasJS.Chart(“chartContainer”,
    {
    colorSet: “blackline”,
    theme: “theme1”,
    animationEnabled: true,
    axisX: {
    valueFormatString: “MMM-YYYY”,
    interval:1,
    intervalType: “month”,
    lineColor:”#000″,
    labelFontSize: 13,
    labelFontColor: “#000″,
    lineThickness:1,
    gridColor:”#e4e4e4″,
    gridThickness:”1”

    },
    axisY:{labelFormatter: function (e) {
    return “Rs.” + CanvasJS.formatNumber(e.value, “#,#00″);
    },
    lineColor:”#9d9d9d”,
    lineThickness:2,
    labelFontSize: 13,
    labelFontColor: “#000″,
    gridColor:”#e4e4e4″,
    gridThickness:”1″,
    interval:5000,
    viewportMinimum: 15000,
    viewportMaximum: 45000,
    includeZero: false

    },
    toolTip:{
    borderColor:”#000″,
    fontStyle:”normal”,
    borderThickness:1,
    cornerRadius:0
    },
    data: [
    {
    type: “line”,
    toolTipContent: “In {x},<br/>Product price was <span style=’\”‘color: #ec5a5a;’\”‘>Rs.{y}</span>”,
    lineThickness: 1,
    markerSize: 8,
    markerColor:”#ec5a5a”,
    dataPoints: [
    { x: new Date(2015, 03, 1), y: 38000 },
    { x: new Date(2015, 04, 1), y: 36000 },
    { x: new Date(2015, 05, 1), y: 33000 },
    { x: new Date(2015, 06, 1), y: 32000 },
    { x: new Date(2015, 07, 1), y: 32000 },
    { x: new Date(2015, 08, 1), y: 30000 },
    { x: new Date(2015, 09, 1), y: 29000 },
    { x: new Date(2015, 10, 1), y: 25000 },
    { x: new Date(2015, 11, 1), y: 25500 },
    { x: new Date(2016, 00, 1), y: 29000 },
    { x: new Date(2016, 01, 1), y: 33000 },
    { x: new Date(2016, 02, 1), y: 32000 },
    { x: new Date(2016, 03, 1), y: 27000 }

    ]
    }

    ]
    });

    chart.render();
    }
    </script>
    <script type=”text/javascript” src=”canvasjs.min.js”></script></head>
    <body>
    <div id=”chartContainer” style=”height: 360px; width: 100%;”></div>
    <br/><br/>
    <div id=”chartContainer” style=”height: 360px; width: 100%;”></div>
    </body>

    </html>

    June 9, 2016 at 11:32 am #11328

    Vishwas R

    Praveen,

    Here are solutions to have same charts in morethan one div by passing same chart-options. Check these solution 1 and solution 2.

    June 9, 2016 at 1:53 pm #11329

    praveen67084

    Thank you Vishwas R. Its working.
    But the problem is one graph is on web page which is coming perfectly but another one is coming on Pop-Up but its not taking full width.
    you check this by this url http://www.pfyidev.apikdd.com/product

    At the bottom of this web page one graph is coming fine but another one when you click on Price Alert then is show a popup where the next graph show but it not take full width. can you tell me why its not take full width.

    June 9, 2016 at 7:49 pm #11334

    Sanjoy

    Hi,

    In this case chart is rendering before container size set. To solve this you can call render method once the Price Alert button is been clicked. We are doing the same in our gallery using jQuery UI Dialog for popup.

    June 22, 2016 at 10:19 am #11426

    praveen67084

    Thank you, Sanjoy for giving your time and solution. now its working fine.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.