Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. Draw basic Axes on QPixmap ?
QtWS25 Last Chance

Draw basic Axes on QPixmap ?

Scheduled Pinned Locked Moved Unsolved General and Desktop
qpixmapqchartqlabelaxisplot
29 Posts 6 Posters 7.7k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • P Pl45m4
    12 Aug 2019, 12:56

    @r-p-h

    Why it has to be a label? QLabels are not supposed to have axis, so I guess there's not an "easy" way.

    Why dont you use QChartView? https://doc.qt.io/qt-5/qchartview.html

    R Offline
    R Offline
    R-P-H
    wrote on 12 Aug 2019, 13:40 last edited by
    #4

    @pl45m4 said in Draw basic Axes on QPixmap ?:

    @r-p-h

    Why it has to be a label? QLabels are not supposed to have axis, so I guess there's not an "easy" way.

    Why dont you use QChartView? https://doc.qt.io/qt-5/qchartview.html

    It definitely doesn't have to be a QLabel. I'm just looking for the easiest most efficient way possible. In my QT Creator, there is no ChartView widget. Also, how would I display my pixmap image inside the chart ?

    @j-hilk said in Draw basic Axes on QPixmap ?:

    hi @r-p-h

    If, you're dead set on using a QLabel,
    than one option would be, SubClassing QLabel, over write QPaintEvent.
    Inside the QPaintEvent, draw first the Image and than the "axis"

    I am not dead-set on using QLabel, what would be the easiest ? Thanks.

    P 1 Reply Last reply 12 Aug 2019, 15:22
    0
    • R R-P-H
      12 Aug 2019, 13:40

      @pl45m4 said in Draw basic Axes on QPixmap ?:

      @r-p-h

      Why it has to be a label? QLabels are not supposed to have axis, so I guess there's not an "easy" way.

      Why dont you use QChartView? https://doc.qt.io/qt-5/qchartview.html

      It definitely doesn't have to be a QLabel. I'm just looking for the easiest most efficient way possible. In my QT Creator, there is no ChartView widget. Also, how would I display my pixmap image inside the chart ?

      @j-hilk said in Draw basic Axes on QPixmap ?:

      hi @r-p-h

      If, you're dead set on using a QLabel,
      than one option would be, SubClassing QLabel, over write QPaintEvent.
      Inside the QPaintEvent, draw first the Image and than the "axis"

      I am not dead-set on using QLabel, what would be the easiest ? Thanks.

      P Offline
      P Offline
      Pl45m4
      wrote on 12 Aug 2019, 15:22 last edited by Pl45m4 8 Dec 2019, 15:22
      #5

      @r-p-h

      A ChartView, but as you already said, you have to create it on runtime, because it`s not a Widget in Qt Designer.


      If debugging is the process of removing software bugs, then programming must be the process of putting them in.

      ~E. W. Dijkstra

      R P 2 Replies Last reply 13 Aug 2019, 09:51
      1
      • P Pl45m4
        12 Aug 2019, 15:22

        @r-p-h

        A ChartView, but as you already said, you have to create it on runtime, because it`s not a Widget in Qt Designer.

        R Offline
        R Offline
        R-P-H
        wrote on 13 Aug 2019, 09:51 last edited by
        #6

        @pl45m4 said in Draw basic Axes on QPixmap ?:

        @r-p-h

        A ChartView, but as you already said, you have to create it on runtime, because it`s not a Widget in Qt Designer.

        But is it possible to set the plot to a QPixmap image ?

        P 1 Reply Last reply 13 Aug 2019, 10:05
        0
        • R R-P-H
          13 Aug 2019, 09:51

          @pl45m4 said in Draw basic Axes on QPixmap ?:

          @r-p-h

          A ChartView, but as you already said, you have to create it on runtime, because it`s not a Widget in Qt Designer.

          But is it possible to set the plot to a QPixmap image ?

          P Offline
          P Offline
          Pl45m4
          wrote on 13 Aug 2019, 10:05 last edited by Pl45m4
          #7

          @r-p-h

          Something like:

          QPixmap pm(chartView->size());
          chartView->render(&pm);
          

          Or

          QPixmap pm = chartView->grab();
          

          What is your real goal? If you use a QChartView it displays your plot. Then you dont need a QPixmap or QLabel.
          Do you want to save your plot to file or just show it?


          If debugging is the process of removing software bugs, then programming must be the process of putting them in.

          ~E. W. Dijkstra

          R 1 Reply Last reply 13 Aug 2019, 10:50
          0
          • P Pl45m4
            13 Aug 2019, 10:05

            @r-p-h

            Something like:

            QPixmap pm(chartView->size());
            chartView->render(&pm);
            

            Or

            QPixmap pm = chartView->grab();
            

            What is your real goal? If you use a QChartView it displays your plot. Then you dont need a QPixmap or QLabel.
            Do you want to save your plot to file or just show it?

            R Offline
            R Offline
            R-P-H
            wrote on 13 Aug 2019, 10:50 last edited by
            #8

            @pl45m4 said in Draw basic Axes on QPixmap ?:

            @r-p-h

            Something like:

            QPixmap pm(chartView->size());
            chartView->render(&pm);
            

            Or

            QPixmap pm = chartView->grab();
            

            What is your real goal? If you use a QChartView it displays your plot. Then you dont need a QPixmap or QLabel.
            Do you want to save your plot to file or just show it?

            I have a QPixmap image. I need to display it on screen with axes...that is all.

            J 1 Reply Last reply 13 Aug 2019, 10:58
            0
            • R R-P-H
              13 Aug 2019, 10:50

              @pl45m4 said in Draw basic Axes on QPixmap ?:

              @r-p-h

              Something like:

              QPixmap pm(chartView->size());
              chartView->render(&pm);
              

              Or

              QPixmap pm = chartView->grab();
              

              What is your real goal? If you use a QChartView it displays your plot. Then you dont need a QPixmap or QLabel.
              Do you want to save your plot to file or just show it?

              I have a QPixmap image. I need to display it on screen with axes...that is all.

              J Offline
              J Offline
              J.Hilk
              Moderators
              wrote on 13 Aug 2019, 10:58 last edited by
              #9

              @r-p-h than I would suggest to do what I said, previously


              Be aware of the Qt Code of Conduct, when posting : https://forum.qt.io/topic/113070/qt-code-of-conduct


              Q: What's that?
              A: It's blue light.
              Q: What does it do?
              A: It turns blue.

              R 1 Reply Last reply 13 Aug 2019, 11:17
              0
              • J J.Hilk
                13 Aug 2019, 10:58

                @r-p-h than I would suggest to do what I said, previously

                R Offline
                R Offline
                R-P-H
                wrote on 13 Aug 2019, 11:17 last edited by
                #10

                @j-hilk said in Draw basic Axes on QPixmap ?:

                @r-p-h than I would suggest to do what I said, previously

                Ok, but how do I go about inserting a QChartView where I want it in the GUI because as you said it isn't available as a widget in QTDesigner and my GUI is in "grid" layout...

                J 1 Reply Last reply 13 Aug 2019, 11:31
                0
                • R R-P-H
                  13 Aug 2019, 11:17

                  @j-hilk said in Draw basic Axes on QPixmap ?:

                  @r-p-h than I would suggest to do what I said, previously

                  Ok, but how do I go about inserting a QChartView where I want it in the GUI because as you said it isn't available as a widget in QTDesigner and my GUI is in "grid" layout...

                  J Offline
                  J Offline
                  J.Hilk
                  Moderators
                  wrote on 13 Aug 2019, 11:31 last edited by
                  #11

                  @r-p-h
                  you're mixing myself and @Pl45m4 ;)

                  I said subclassing QLabel

                  #include <QApplication>
                  #include <QLabel>
                  #include <QPainter>
                  #include <QDebug>
                  
                  class myLabel : public QLabel
                  {
                  public:
                      explicit myLabel(QWidget *parent = nullptr) : QLabel(parent) {
                          QImage img(200,200, QImage::Format_RGB888);
                          img.fill(Qt::green);
                          m_pixmap = QPixmap::fromImage(img);
                      }
                  
                  private:
                      QPixmap m_pixmap;
                  protected:
                      virtual void paintEvent(QPaintEvent *event)override{
                          QLabel::paintEvent(event);//Basic drawing of the Parent class -> styles etc
                          QPainter p(this);
                  
                          p.drawPixmap(0,0,width(), height(),m_pixmap);
                          p.setPen(QPen(Qt::red));
                          p.drawLine(QPointF(10,0), QPointF(10, height()));
                          p.drawLine(QPointF(0, height() - 10), QPointF(width(), height() -10));
                      }
                  };
                  
                  
                  int main(int argc, char *argv[])
                  {
                  
                      QApplication a(argc, argv);
                  
                      myLabel m;
                      m.resize(400,400);
                      m.show();
                  
                      return  a.exec();
                  }
                  

                  Be aware of the Qt Code of Conduct, when posting : https://forum.qt.io/topic/113070/qt-code-of-conduct


                  Q: What's that?
                  A: It's blue light.
                  Q: What does it do?
                  A: It turns blue.

                  R 1 Reply Last reply 14 Aug 2019, 14:16
                  3
                  • J J.Hilk
                    13 Aug 2019, 11:31

                    @r-p-h
                    you're mixing myself and @Pl45m4 ;)

                    I said subclassing QLabel

                    #include <QApplication>
                    #include <QLabel>
                    #include <QPainter>
                    #include <QDebug>
                    
                    class myLabel : public QLabel
                    {
                    public:
                        explicit myLabel(QWidget *parent = nullptr) : QLabel(parent) {
                            QImage img(200,200, QImage::Format_RGB888);
                            img.fill(Qt::green);
                            m_pixmap = QPixmap::fromImage(img);
                        }
                    
                    private:
                        QPixmap m_pixmap;
                    protected:
                        virtual void paintEvent(QPaintEvent *event)override{
                            QLabel::paintEvent(event);//Basic drawing of the Parent class -> styles etc
                            QPainter p(this);
                    
                            p.drawPixmap(0,0,width(), height(),m_pixmap);
                            p.setPen(QPen(Qt::red));
                            p.drawLine(QPointF(10,0), QPointF(10, height()));
                            p.drawLine(QPointF(0, height() - 10), QPointF(width(), height() -10));
                        }
                    };
                    
                    
                    int main(int argc, char *argv[])
                    {
                    
                        QApplication a(argc, argv);
                    
                        myLabel m;
                        m.resize(400,400);
                        m.show();
                    
                        return  a.exec();
                    }
                    
                    R Offline
                    R Offline
                    R-P-H
                    wrote on 14 Aug 2019, 14:16 last edited by
                    #12

                    @j-hilk said in Draw basic Axes on QPixmap ?:

                    @r-p-h
                    you're mixing myself and @Pl45m4 ;)

                    I said subclassing QLabel

                    #include <QApplication>
                    #include <QLabel>
                    #include <QPainter>
                    #include <QDebug>
                    
                    class myLabel : public QLabel
                    {
                    public:
                        explicit myLabel(QWidget *parent = nullptr) : QLabel(parent) {
                            QImage img(200,200, QImage::Format_RGB888);
                            img.fill(Qt::green);
                            m_pixmap = QPixmap::fromImage(img);
                        }
                    
                    private:
                        QPixmap m_pixmap;
                    protected:
                        virtual void paintEvent(QPaintEvent *event)override{
                            QLabel::paintEvent(event);//Basic drawing of the Parent class -> styles etc
                            QPainter p(this);
                    
                            p.drawPixmap(0,0,width(), height(),m_pixmap);
                            p.setPen(QPen(Qt::red));
                            p.drawLine(QPointF(10,0), QPointF(10, height()));
                            p.drawLine(QPointF(0, height() - 10), QPointF(width(), height() -10));
                        }
                    };
                    
                    
                    int main(int argc, char *argv[])
                    {
                    
                        QApplication a(argc, argv);
                    
                        myLabel m;
                        m.resize(400,400);
                        m.show();
                    
                        return  a.exec();
                    }
                    

                    Sorry you're correct, I was confusing the two of you. Why does this need to be in a class format like how you showed ? Can I not directly paint the QLabel ? Also I usually resize the image to the size of the label before putting it in QLabel. Now will this still be possible - won't the pixmap get cut off or over extend past the label when drawing it...

                    J 1 Reply Last reply 14 Aug 2019, 14:33
                    0
                    • M Offline
                      M Offline
                      mrjj
                      Lifetime Qt Champion
                      wrote on 14 Aug 2019, 14:32 last edited by mrjj
                      #13

                      Hi
                      yes you can do it without wrapping in a class, even i must say its a bit nicer. ( the way @J.Hilk has shown)

                      int GetBarHeight(int MAX) {
                        return rand() % (MAX - 5) + 5;
                      }
                      
                      void MainWindow::on_pushButton_released() {
                      
                        int h = ui->label->height();
                        int w = ui->label->width();
                      
                        QPixmap pix(w, h);
                        QPainter paint(&pix);
                        pix.fill( Qt::white );
                        paint.setPen(QColor(0, 0, 0, 255));
                      
                      
                        int y = 0;
                        int x = 0;
                      
                        int bw = 10; // bar width
                        for (int barcount = 0; barcount < 12; ++barcount) {
                          paint.setBrush(QColor(255 - x, 34 + x, 255, 255));
                          paint.drawRect(x, h - GetBarHeight(h),  bw, h );
                          x += bw + 4;
                        }
                        paint.end();
                        ui->label->setPixmap(pix);
                      }
                      
                      

                      alt text

                      test project
                      https://www.dropbox.com/s/qwde8lb0fkjrrh3/mycheapgraph.zip?dl=0

                      1 Reply Last reply
                      1
                      • R R-P-H
                        14 Aug 2019, 14:16

                        @j-hilk said in Draw basic Axes on QPixmap ?:

                        @r-p-h
                        you're mixing myself and @Pl45m4 ;)

                        I said subclassing QLabel

                        #include <QApplication>
                        #include <QLabel>
                        #include <QPainter>
                        #include <QDebug>
                        
                        class myLabel : public QLabel
                        {
                        public:
                            explicit myLabel(QWidget *parent = nullptr) : QLabel(parent) {
                                QImage img(200,200, QImage::Format_RGB888);
                                img.fill(Qt::green);
                                m_pixmap = QPixmap::fromImage(img);
                            }
                        
                        private:
                            QPixmap m_pixmap;
                        protected:
                            virtual void paintEvent(QPaintEvent *event)override{
                                QLabel::paintEvent(event);//Basic drawing of the Parent class -> styles etc
                                QPainter p(this);
                        
                                p.drawPixmap(0,0,width(), height(),m_pixmap);
                                p.setPen(QPen(Qt::red));
                                p.drawLine(QPointF(10,0), QPointF(10, height()));
                                p.drawLine(QPointF(0, height() - 10), QPointF(width(), height() -10));
                            }
                        };
                        
                        
                        int main(int argc, char *argv[])
                        {
                        
                            QApplication a(argc, argv);
                        
                            myLabel m;
                            m.resize(400,400);
                            m.show();
                        
                            return  a.exec();
                        }
                        

                        Sorry you're correct, I was confusing the two of you. Why does this need to be in a class format like how you showed ? Can I not directly paint the QLabel ? Also I usually resize the image to the size of the label before putting it in QLabel. Now will this still be possible - won't the pixmap get cut off or over extend past the label when drawing it...

                        J Offline
                        J Offline
                        J.Hilk
                        Moderators
                        wrote on 14 Aug 2019, 14:33 last edited by J.Hilk
                        #14

                        @r-p-h

                        Sorry you're correct, I was confusing the two of you.

                        No worries 😉

                        Why does this need to be in a class format like how you showed ? Can I not directly paint the QLabel ?

                        no, painting on a QLabel can only be done inside the paintEvent function. To access that function subclassing is requiert

                        Also I usually resize the image to the size of the label before putting it in QLabel. Now will this still be possible - won't the pixmap get cut off or over extend past the label when drawing it...

                        in the example the pixmap actually get’s stretched. In the end you have full control over it. But IIRC you will never be able to paint outside a Qwidgets boundaries.

                        ———
                        That said, you can potentially use the QPainter on the QPixmap directly and draw the axis that way.

                        Edit: @mrjj beat me to it, with an actual example as well 😳


                        Be aware of the Qt Code of Conduct, when posting : https://forum.qt.io/topic/113070/qt-code-of-conduct


                        Q: What's that?
                        A: It's blue light.
                        Q: What does it do?
                        A: It turns blue.

                        1 Reply Last reply
                        1
                        • R Offline
                          R Offline
                          R-P-H
                          wrote on 14 Aug 2019, 15:26 last edited by
                          #15

                          Thanks @J-Hilk and @mrjj , I will give it a try and see how it goes. ;)

                          1 Reply Last reply
                          0
                          • M Offline
                            M Offline
                            mrjj
                            Lifetime Qt Champion
                            wrote on 14 Aug 2019, 15:28 last edited by mrjj
                            #16

                            Hi
                            Regarding the axis.
                            One option is to simply draw them in inkscape and save as SVG.
                            Then just paint the SVG on top of the image.
                            That should be faster than draw the ticks and values by hand using painter.
                            However, if axis values change or zoom is needed then its not good idea.

                            R 1 Reply Last reply 14 Aug 2019, 16:26
                            0
                            • M mrjj
                              14 Aug 2019, 15:28

                              Hi
                              Regarding the axis.
                              One option is to simply draw them in inkscape and save as SVG.
                              Then just paint the SVG on top of the image.
                              That should be faster than draw the ticks and values by hand using painter.
                              However, if axis values change or zoom is needed then its not good idea.

                              R Offline
                              R Offline
                              R-P-H
                              wrote on 14 Aug 2019, 16:26 last edited by
                              #17

                              @mrjj said in Draw basic Axes on QPixmap ?:

                              Hi
                              Regarding the axis.
                              One option is to simply draw them in inkscape and save as SVG.
                              Then just paint the SVG on top of the image.
                              That should be faster than draw the ticks and values by hand using painter.
                              However, if axis values change or zoom is needed then its not good idea.

                              Hi, the "plot/image" is not interactive. The axis values do change but only each time a user changes a setting. So the axis would have to somehow be made on the fly for each "session". During the "session" the axis remain the same though while the image does change ! So I'm not sure what's the most efficient way of doing it...

                              M 1 Reply Last reply 14 Aug 2019, 16:30
                              0
                              • R R-P-H
                                14 Aug 2019, 16:26

                                @mrjj said in Draw basic Axes on QPixmap ?:

                                Hi
                                Regarding the axis.
                                One option is to simply draw them in inkscape and save as SVG.
                                Then just paint the SVG on top of the image.
                                That should be faster than draw the ticks and values by hand using painter.
                                However, if axis values change or zoom is needed then its not good idea.

                                Hi, the "plot/image" is not interactive. The axis values do change but only each time a user changes a setting. So the axis would have to somehow be made on the fly for each "session". During the "session" the axis remain the same though while the image does change ! So I'm not sure what's the most efficient way of doing it...

                                M Offline
                                M Offline
                                mrjj
                                Lifetime Qt Champion
                                wrote on 14 Aug 2019, 16:30 last edited by
                                #18

                                @r-p-h
                                Well if its very dynamic then hand painting them with painter should do it.
                                Overlaying a svg with only part of the axis is likely more fiddle fiddle to place the values correctly
                                so just drawing it should be the way to go.
                                Do you have image of the needed axis?

                                R 1 Reply Last reply 14 Aug 2019, 18:42
                                0
                                • M mrjj
                                  14 Aug 2019, 16:30

                                  @r-p-h
                                  Well if its very dynamic then hand painting them with painter should do it.
                                  Overlaying a svg with only part of the axis is likely more fiddle fiddle to place the values correctly
                                  so just drawing it should be the way to go.
                                  Do you have image of the needed axis?

                                  R Offline
                                  R Offline
                                  R-P-H
                                  wrote on 14 Aug 2019, 18:42 last edited by
                                  #19

                                  @mrjj said in Draw basic Axes on QPixmap ?:

                                  @r-p-h
                                  Well if its very dynamic then hand painting them with painter should do it.
                                  Overlaying a svg with only part of the axis is likely more fiddle fiddle to place the values correctly
                                  so just drawing it should be the way to go.
                                  Do you have image of the needed axis?

                                  The image is live though so it's constantly being displayed in a loop, so I'm not sure if re-drawing the axes constantly is such a good idea.

                                  M 1 Reply Last reply 15 Aug 2019, 06:33
                                  0
                                  • R R-P-H
                                    14 Aug 2019, 18:42

                                    @mrjj said in Draw basic Axes on QPixmap ?:

                                    @r-p-h
                                    Well if its very dynamic then hand painting them with painter should do it.
                                    Overlaying a svg with only part of the axis is likely more fiddle fiddle to place the values correctly
                                    so just drawing it should be the way to go.
                                    Do you have image of the needed axis?

                                    The image is live though so it's constantly being displayed in a loop, so I'm not sure if re-drawing the axes constantly is such a good idea.

                                    M Offline
                                    M Offline
                                    mrjj
                                    Lifetime Qt Champion
                                    wrote on 15 Aug 2019, 06:33 last edited by
                                    #20

                                    @r-p-h
                                    oh, well for that sort of overlay,
                                    you will need to draw the axis
                                    anytime the image changes regardlessly.

                                    R 1 Reply Last reply 15 Aug 2019, 22:10
                                    0
                                    • M mrjj
                                      15 Aug 2019, 06:33

                                      @r-p-h
                                      oh, well for that sort of overlay,
                                      you will need to draw the axis
                                      anytime the image changes regardlessly.

                                      R Offline
                                      R Offline
                                      R-P-H
                                      wrote on 15 Aug 2019, 22:10 last edited by
                                      #21

                                      @mrjj said in Draw basic Axes on QPixmap ?:

                                      @r-p-h
                                      oh, well for that sort of overlay,
                                      you will need to draw the axis
                                      anytime the image changes regardlessly.

                                      Hi, Surely I could just draw (or plot ?) the axes once in the beginning and then just display or draw the image inside the plot. I think that re-drawing the axes every time will be very inefficient. Also manually drawing the tick marks and values seems like it could become tedious, so maybe using some form of QChart is the way to go...

                                      1 Reply Last reply
                                      0
                                      • M Offline
                                        M Offline
                                        mrjj
                                        Lifetime Qt Champion
                                        wrote on 16 Aug 2019, 06:24 last edited by
                                        #22

                                        Hi
                                        Well it sounds to me like the image is live ?
                                        Like a camera feed ?

                                        R 1 Reply Last reply 16 Aug 2019, 11:12
                                        0
                                        • M mrjj
                                          16 Aug 2019, 06:24

                                          Hi
                                          Well it sounds to me like the image is live ?
                                          Like a camera feed ?

                                          R Offline
                                          R Offline
                                          R-P-H
                                          wrote on 16 Aug 2019, 11:12 last edited by
                                          #23

                                          @mrjj said in Draw basic Axes on QPixmap ?:

                                          Hi
                                          Well it sounds to me like the image is live ?
                                          Like a camera feed ?

                                          Yes. Pretty much.

                                          1 Reply Last reply
                                          0

                                          13/29

                                          14 Aug 2019, 14:32

                                          • Login

                                          • Login or register to search.
                                          13 out of 29
                                          • First post
                                            13/29
                                            Last post
                                          0
                                          • Categories
                                          • Recent
                                          • Tags
                                          • Popular
                                          • Users
                                          • Groups
                                          • Search
                                          • Get Qt Extensions
                                          • Unsolved