Home forums Using CanvasJS multi-series within multi-chart and together control zoom.

Tagged: 

This topic contains 9 replies, has 4 voices, and was last updated by  Vishwas R 1 year, 3 months ago.

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #18865

    i need a step line chart for signal data. everyone have specific axes, we have over 5 charts for the series.
    something like one for temperature, one for angel, one for speed….etc.
    the X-axes is time stamp, i need to review this chart(s) on same time stamp (zooming or panning).
    the final chart like a building , It has some floor. Every floor for one series data.
    So, Can i do it in CanvasJS ??

    #18869

    @luispang,

    Can you kindly provide us some pictorial representation or jsfiddle along with sample data of your requirement, so that we can understand it better and help you out?

    ___
    Suyash Singh
    Team CanvasJS

    #18874

    Sample Charts

    The simulation results as picture.

    #18890

    @luispang,

    Please have a look at this jsfiddle.

    ___
    Suyash Singh
    Team CanvasJS

    #19896

    Hi Suyash,

    Thank you for your help.
    I’ve last two question.
    1.Can i active crosshair axisX on each chart at same time?
    null
    2.Can i get the value of different between axis X two point ?
    null

    Luis Pang

    #19898

    @luispang,

    1.Can i active crosshair axisX on each chart at same time?

    Please take a look at this jsfiddle to Sync crosshair across multiple charts.

    2.Can i get the value of different between axis X two point ?

    Do you mean to calculate the difference by selecting the two dataPoints? You can select dataPoints on click as shown in this jsfiddle.

    ___________
    Indranil Deo,
    Team CanvasJS

    #19899

    Hi; Indranil,

    about 1. is ok, but when the mouse on second chart,the first chart is not work.
    about 2. my mean is to calculate the difference by selecting the two dataPoints.

    Luis

    #19921

    @Luis,

    about 1. is ok, but when the mouse on second chart,the first chart is not work.

    You can try triggering event for the first chart based on the event fired in the second chart. That should work fine in your case.

    about 2. my mean is to calculate the difference by selecting the two dataPoints.

    Please take a look at this jsfiddle.

    ___________
    Indranil Deo,
    Team CanvasJS

    #22053

    I need to use the cross hair on multi-series chart, and the chart number is a variable .
    the code is follow:

    <? for ($i=0;$i<count($selItem);$i++) { ?>

    <script type=”text/javascript”>
    $(function () {
    var chart = new CanvasJS.Chart(“chartContainer<? echo $i ?>”, {

    //width: 100%,
    zoomEnabled: true,
    animationEnabled: true,
    //exportEnabled: true,

    title: {
    text: “<? echo $selMsgName[$i] ?>”
    },
    toolTip:{
    shared: true
    },
    axisX:{
    crosshair : {
    enabled: true,
    color: “orange”,
    labelFontColor: “#F8F8F8”}
    },

    axisY:{
    margin: 30,
    interval: 1,
    labelFormatter: function (e) {
    return customLabel<? echo $i ?>(e.value);
    },
    crosshair : {
    enabled: true,
    color: “orange”,
    labelFontColor: “#F8F8F8”},

    },

    data: [
    {
    type: “stepLine”,
    connectNullData: true,
    markerSize: 5,
    dataPoints: [<? echo $data[$i] ?>]
    }
    ]
    });
    chart.render();
    });
    </script>

    <? } ?>

    how can i do?

    #22056

    @luispang,

    Can you kindly share working sample along with sample data over Google-Drive or Onedrive, so that we can understand your requirements better and help you out?


    Vishwas R
    Team CanvasJS

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

You must be logged in to reply to this topic.