Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Surface3D makes random lines



  • Hi,

    I want to to draw 3d surface using some points, I use Surface3D to draw that surface.
    The problem is Surface3D always create random lines from beginning and ending of surface to the origin point (0,0,0), however the origin point doesn't exist in my cloud points.

    For example, I run this code
    main.qml

    
    import QtQuick 2.1
    import QtQuick.Controls 2.2
    import QtQuick.Layouts 1.0
    import QtDataVisualization 1.3
    
    Rectangle {
        id: mainview
        width: 1024
        height: 768
        color: surfacePlot.theme.windowColor
    
        Data {
            id: surfaceData
        }
    
        Item {
            id: surfaceView
            width: mainview.width
            height: mainview.height
            anchors.top: mainview.top
            anchors.left: mainview.left
    
            ColorGradient {
                id: surfaceGradient
                ColorGradientStop { position: 0.0; color: "darkslategray" }
                ColorGradientStop { id: middleGradient; position: 0.25; color: "peru" }
                ColorGradientStop { position: 1.0; color: "red" }
            }
    
            Surface3D {
                id: surfacePlot
                width: surfaceView.width
                height: surfaceView.height
                //! [7]
                theme: Theme3D {
                    type: Theme3D.ThemeStoneMoss
                    font.family: "STCaiyun"
                    font.pointSize: 35
                    colorStyle: Theme3D.ColorStyleRangeGradient
                    baseGradients: [surfaceGradient]
                }
                //! [7]
                shadowQuality: AbstractGraph3D.ShadowQualityNone
                selectionMode: AbstractGraph3D.SelectionSlice | AbstractGraph3D.SelectionItemAndRow
                scene.activeCamera.cameraPreset: Camera3D.CameraPresetIsometricLeft
                axisX.min: 0
                axisX.max: 500
                axisY.min: 20
                axisY.max: 300
                axisZ.min: 0
                axisZ.max: 500
                axisX.segmentCount: 10
                axisX.subSegmentCount: 2
                axisX.labelFormat: "%i"
                axisZ.segmentCount: 10
                axisZ.subSegmentCount: 2
                axisZ.labelFormat: "%i"
                axisY.segmentCount: 5
                axisY.subSegmentCount: 2
                axisY.labelFormat: "%i"
                axisY.title: "Height"
                axisX.title: "Latitude"
                axisZ.title: "Longitude"
    
                //! [5]
                Surface3DSeries {
                    id: surfaceSeries
                    flatShadingEnabled: false
                    drawMode: Surface3DSeries.DrawSurface
    
                    ItemModelSurfaceDataProxy {
                        itemModel: surfaceData.model
                        rowRole: "longitude"
                        columnRole: "latitude"
                        yPosRole: "height"
                    }
                }
            }
        }
    }
    

    Data.qml

    import QtQuick 2.1
    
    Item {
        property alias model: dataModel
    
        //! [0]
        ListModel {
            id: dataModel
            ListElement{ longitude: 50; latitude: 200; height: 50; }
            ListElement{ longitude: 50; latitude: 210; height: 53; }
            ListElement{ longitude: 50; latitude: 220; height: 50; }
            ListElement{ longitude: 50; latitude: 230; height: 51; }
            ListElement{ longitude: 50; latitude: 240; height: 52; }
            ListElement{ longitude: 50; latitude: 250; height: 54; }
            ListElement{ longitude: 50; latitude: 260; height: 54; }
            ListElement{ longitude: 50; latitude: 270; height: 51; }
            ListElement{ longitude: 50; latitude: 280; height: 51; }
            ListElement{ longitude: 50; latitude: 290; height: 51; }
            ListElement{ longitude: 50; latitude: 300; height: 52; }
            ListElement{ longitude: 50; latitude: 310; height: 50; }
            ListElement{ longitude: 50; latitude: 320; height: 54; }
            ListElement{ longitude: 50; latitude: 330; height: 54; }
            ListElement{ longitude: 50; latitude: 340; height: 50; }
            ListElement{ longitude: 50; latitude: 350; height: 54; }
            ListElement{ longitude: 50; latitude: 360; height: 52; }
            ListElement{ longitude: 50; latitude: 370; height: 50; }
            ListElement{ longitude: 50; latitude: 380; height: 53; }
            ListElement{ longitude: 50; latitude: 390; height: 54; }
            ListElement{ longitude: 60; latitude: 400; height: 50; }
            ListElement{ longitude: 60; latitude: 390; height: 50; }
            ListElement{ longitude: 60; latitude: 380; height: 50; }
            ListElement{ longitude: 60; latitude: 370; height: 51; }
            ListElement{ longitude: 60; latitude: 360; height: 53; }
            ListElement{ longitude: 60; latitude: 350; height: 52; }
            ListElement{ longitude: 60; latitude: 340; height: 51; }
            ListElement{ longitude: 60; latitude: 330; height: 53; }
            ListElement{ longitude: 60; latitude: 320; height: 54; }
            ListElement{ longitude: 60; latitude: 310; height: 51; }
            ListElement{ longitude: 60; latitude: 300; height: 54; }
            ListElement{ longitude: 60; latitude: 290; height: 53; }
            ListElement{ longitude: 60; latitude: 280; height: 53; }
            ListElement{ longitude: 60; latitude: 270; height: 52; }
            ListElement{ longitude: 60; latitude: 260; height: 51; }
            ListElement{ longitude: 60; latitude: 250; height: 54; }
            ListElement{ longitude: 60; latitude: 240; height: 53; }
            ListElement{ longitude: 60; latitude: 230; height: 51; }
            ListElement{ longitude: 60; latitude: 220; height: 51; }
            ListElement{ longitude: 60; latitude: 210; height: 54; }
            ListElement{ longitude: 60; latitude: 200; height: 54; }
            ListElement{ longitude: 60; latitude: 190; height: 50; }
            ListElement{ longitude: 60; latitude: 180; height: 54; }
            ListElement{ longitude: 60; latitude: 170; height: 50; }
            ListElement{ longitude: 60; latitude: 160; height: 54; }
            ListElement{ longitude: 60; latitude: 150; height: 53; }
            ListElement{ longitude: 60; latitude: 140; height: 54; }
            ListElement{ longitude: 60; latitude: 130; height: 50; }
            ListElement{ longitude: 60; latitude: 120; height: 52; }
            ListElement{ longitude: 60; latitude: 110; height: 50; }
            ListElement{ longitude: 60; latitude: 100; height: 52; }
            ListElement{ longitude: 60; latitude: 90; height: 50; }
            ListElement{ longitude: 60; latitude: 80; height: 50; }
            ListElement{ longitude: 60; latitude: 70; height: 51; }
            ListElement{ longitude: 60; latitude: 60; height: 54; }
            ListElement{ longitude: 60; latitude: 50; height: 52; }
            ListElement{ longitude: 60; latitude: 40; height: 53; }
            ListElement{ longitude: 60; latitude: 30; height: 54; }
            ListElement{ longitude: 60; latitude: 20; height: 50; }
            ListElement{ longitude: 60; latitude: 10; height: 50; }
            ListElement{ longitude: 70; latitude: 0; height: 51; }
            ListElement{ longitude: 70; latitude: 10; height: 52; }
            ListElement{ longitude: 70; latitude: 20; height: 54; }
            ListElement{ longitude: 70; latitude: 30; height: 52; }
            ListElement{ longitude: 70; latitude: 40; height: 54; }
            ListElement{ longitude: 70; latitude: 50; height: 51; }
            ListElement{ longitude: 70; latitude: 60; height: 53; }
            ListElement{ longitude: 70; latitude: 70; height: 50; }
            ListElement{ longitude: 70; latitude: 80; height: 53; }
            ListElement{ longitude: 70; latitude: 90; height: 54; }
            ListElement{ longitude: 70; latitude: 100; height: 54; }
            ListElement{ longitude: 70; latitude: 110; height: 54; }
            ListElement{ longitude: 70; latitude: 120; height: 53; }
            ListElement{ longitude: 70; latitude: 130; height: 53; }
            ListElement{ longitude: 70; latitude: 140; height: 52; }
            ListElement{ longitude: 70; latitude: 150; height: 52; }
            ListElement{ longitude: 70; latitude: 160; height: 53; }
            ListElement{ longitude: 70; latitude: 170; height: 52; }
            ListElement{ longitude: 70; latitude: 180; height: 50; }
            ListElement{ longitude: 70; latitude: 190; height: 51; }
            ListElement{ longitude: 70; latitude: 200; height: 53; }
            ListElement{ longitude: 70; latitude: 210; height: 54; }
            ListElement{ longitude: 70; latitude: 220; height: 50; }
            ListElement{ longitude: 70; latitude: 230; height: 51; }
            ListElement{ longitude: 70; latitude: 240; height: 50; }
            ListElement{ longitude: 70; latitude: 250; height: 54; }
            ListElement{ longitude: 70; latitude: 260; height: 50; }
            ListElement{ longitude: 70; latitude: 270; height: 50; }
            ListElement{ longitude: 70; latitude: 280; height: 51; }
            ListElement{ longitude: 70; latitude: 290; height: 53; }
            ListElement{ longitude: 70; latitude: 300; height: 50; }
            ListElement{ longitude: 70; latitude: 310; height: 53; }
            ListElement{ longitude: 70; latitude: 320; height: 52; }
            ListElement{ longitude: 70; latitude: 330; height: 51; }
            ListElement{ longitude: 70; latitude: 340; height: 53; }
            ListElement{ longitude: 70; latitude: 350; height: 51; }
            ListElement{ longitude: 70; latitude: 360; height: 52; }
            ListElement{ longitude: 70; latitude: 370; height: 51; }
            ListElement{ longitude: 70; latitude: 380; height: 53; }
            ListElement{ longitude: 70; latitude: 390; height: 54; }
            ListElement{ longitude: 80; latitude: 400; height: 54; }
            ListElement{ longitude: 80; latitude: 390; height: 52; }
            ListElement{ longitude: 80; latitude: 380; height: 53; }
            ListElement{ longitude: 80; latitude: 370; height: 51; }
            ListElement{ longitude: 80; latitude: 360; height: 50; }
            ListElement{ longitude: 80; latitude: 350; height: 52; }
            ListElement{ longitude: 80; latitude: 340; height: 53; }
            ListElement{ longitude: 80; latitude: 330; height: 52; }
            ListElement{ longitude: 80; latitude: 320; height: 51; }
            ListElement{ longitude: 80; latitude: 310; height: 53; }
            ListElement{ longitude: 80; latitude: 300; height: 54; }
            ListElement{ longitude: 80; latitude: 290; height: 53; }
            ListElement{ longitude: 80; latitude: 280; height: 52; }
            ListElement{ longitude: 80; latitude: 270; height: 54; }
            ListElement{ longitude: 80; latitude: 260; height: 53; }
            ListElement{ longitude: 80; latitude: 250; height: 50; }
            ListElement{ longitude: 80; latitude: 240; height: 54; }
            ListElement{ longitude: 80; latitude: 230; height: 50; }
            ListElement{ longitude: 80; latitude: 220; height: 50; }
            ListElement{ longitude: 80; latitude: 210; height: 52; }
            ListElement{ longitude: 80; latitude: 200; height: 50; }
            ListElement{ longitude: 80; latitude: 190; height: 50; }
            ListElement{ longitude: 80; latitude: 180; height: 50; }
            ListElement{ longitude: 80; latitude: 170; height: 51; }
            ListElement{ longitude: 80; latitude: 160; height: 52; }
            ListElement{ longitude: 80; latitude: 150; height: 53; }
            ListElement{ longitude: 80; latitude: 140; height: 50; }
            ListElement{ longitude: 80; latitude: 130; height: 51; }
            ListElement{ longitude: 80; latitude: 120; height: 50; }
            ListElement{ longitude: 80; latitude: 110; height: 52; }
            ListElement{ longitude: 80; latitude: 100; height: 53; }
            ListElement{ longitude: 80; latitude: 90; height: 54; }
            ListElement{ longitude: 80; latitude: 80; height: 53; }
            ListElement{ longitude: 80; latitude: 70; height: 50; }
            ListElement{ longitude: 80; latitude: 60; height: 54; }
            ListElement{ longitude: 80; latitude: 50; height: 53; }
            ListElement{ longitude: 80; latitude: 40; height: 52; }
            ListElement{ longitude: 80; latitude: 30; height: 50; }
            ListElement{ longitude: 80; latitude: 20; height: 54; }
            ListElement{ longitude: 80; latitude: 10; height: 50; }
            ListElement{ longitude: 90; latitude: 0; height: 53; }
            ListElement{ longitude: 90; latitude: 10; height: 52; }
            ListElement{ longitude: 90; latitude: 20; height: 52; }
            ListElement{ longitude: 90; latitude: 30; height: 53; }
            ListElement{ longitude: 90; latitude: 40; height: 54; }
            ListElement{ longitude: 90; latitude: 50; height: 52; }
            ListElement{ longitude: 90; latitude: 60; height: 52; }
            ListElement{ longitude: 90; latitude: 70; height: 54; }
            ListElement{ longitude: 90; latitude: 80; height: 50; }
        }
    }
    

    I suppose that a thin surface should be rendered, but the following surface is rendered
    8fcfddf1-1bc4-4cfe-b916-71f90a17dc2c-image.png

    Can anyone explain why there are lines between edges of surface and origin point and how can I eliminate them ?

    Thanks!


Log in to reply