English 中文(简体)
如何在图.js中轮换一条线图?
原标题:How to rotate a linear graphic in chart.js?

我用图表 j生成了直线图表,但我必须显示其立场与缺省情况不同。

我看到了一些例子,说明如何轮用图制作的标签,但这只是对文本而不是整个图形进行操作。

目前,这是我编制图表的法典。

var dataSets = [
      dt1 = {
        borderColor: "#434EDA",
        data: [17.28, 22.58, 27.91, 31.95, 36.32, 41.73, 45.78, 48.55, 53.48, 47.82,],
        fill: false,
        label: "Dataset1",
        pointHitRadius: 5,
        pointRadius: 5
      },
      dt2 = {
        borderColor: "#3DE383",
        data: [11.83, 20.23, 26.9, 32.39, 36.95, 41.48, 46.41, 48.82, 52.58, 49.42,],
        fill: false,
        label: "Dataset2",
        pointHitRadius: 5,
        pointRadius: 5
      },
      dt3 = {
        borderColor: "#ec0000",
        data: [14.2, 20.94, 27.36, 32.12, 36.33, 41.4, 46.58, 48.8, 52.69, 48.9,],
        fill: false,
        label: "Dataset3",
        pointHitRadius: 5,
        pointRadius: 5
      }
    ]

    var grafValues = {
      labels: ["0 mts", "1 mts", "2 mts", "3 mts", "4 mts", "5 mts", "6 mts", "7 mts", "8 mts",],
      datasets: dataSets,
    }

    var grafOptions = {
            // responsive: true,
            scales: {
                xAxes: [{
                        display: true,
                        scaleLabel: {
                            display: true,
                            labelString: "Depth"
                        },
                }],
                yAxes: [{
                        display: true,
                        scaleLabel: {
                            display: true,
                            labelString: "Temperature ° C"
                        },
                }]
            },
            title: {
                display: true,
                text: "Graphic 1"
            },
            legend: {
                display: true,
                position:  top ,
                labels: {
                    boxWidth: 40,
                    fontColor:  black 
                }
            },
            tooltips: {
                enabled: true
            }
        }

        var ctx = document.getElementById( chart-zone ).getContext( 2d );
        var lineChart = new Chart(ctx, {
          type:  line ,
          data: grafValues,
          options: grafOptions
        })
<head>
    <meta charset="utf-8">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  </head>
  <body>
   <canvas id="chart-zone" ></canvas>
  </body>
  

我希望有一张图像显示的轮值如下:

“enterography

http://www.ohchr.org。

我在调查图表中略微多一点。

在法典这一部分适用这些选择

xAxes: [{
                    display: true,
                    scaleLabel: {
                        display: true,
                        labelString: "Depth",
                    },
                    position:  left  //X-axis position change
            }],
            yAxes: [{
                    display: true,
                    scaleLabel: {
                        display: true,
                        labelString: "Temperature ° C",
                    },
                    position:  top  //Y-axis position change
            }]

但现在的问题是,由于X-轴心中的价值观不存在,这些价值观已经消失。 实现法典的修改,并将看到我的含义。

感谢您的帮助和建议。

问题回答




相关问题
selected text in iframe

How to get a selected text inside a iframe. I my page i m having a iframe which is editable true. So how can i get the selected text in that iframe.

How to fire event handlers on the link using javascript

I would like to click a link in my page using javascript. I would like to Fire event handlers on the link without navigating. How can this be done? This has to work both in firefox and Internet ...

How to Add script codes before the </body> tag ASP.NET

Heres the problem, In Masterpage, the google analytics code were pasted before the end of body tag. In ASPX page, I need to generate a script (google addItem tracker) using codebehind ClientScript ...

Clipboard access using Javascript - sans Flash?

Is there a reliable way to access the client machine s clipboard using Javascript? I continue to run into permissions issues when attempting to do this. How does Google Docs do this? Do they use ...

javascript debugging question

I have a large javascript which I didn t write but I need to use it and I m slowely going trough it trying to figure out what does it do and how, I m using alert to print out what it does but now I ...

Parsing date like twitter

I ve made a little forum and I want parse the date on newest posts like twitter, you know "posted 40 minutes ago ","posted 1 hour ago"... What s the best way ? Thanx.

热门标签