ecomfe / zrender

A lightweight graphic library providing 2d draw for Apache ECharts
https://ecomfe.github.io/zrender-doc/public/
BSD 3-Clause "New" or "Revised" License
6.06k stars 1.56k forks source link

feat(polyline): support drawMode: lines #1098

Open Ovilia opened 2 weeks ago

Ovilia commented 2 weeks ago

The current implementation of Polyline supports only consecutive line segments, e.g. [[100, 10], [200, 20], [300, 33]] means lines from [100, 10] to [200, 20] and [200, 20] to [300, 33]. But if we want to draw non-consecutive lines like [100, 10] to [200, 20] and [400, 40] to [300, 33], we can only use two polylines, which is both more tedious to write and less efficient.

In this PR, I propose a new interface drawMode: 'lineStrip' | 'lines' for Polyline. Its default value is 'lineStrip', which ensures compatibility with the old API.

The concept is borrowed from OpenGL with GL_LINE_STRIP (continuous series of connected line segment) GL_LINES (treating every pair of vertices as an independent line segment).

new zrender.Polyline({
    shape: {
        points: [
            [400, 50],
            [500, 100],

            [500, 200],
            [600, 400],

            [600, 400],
            [500, 350],

            [500, 350],
            [400, 400]
        ],
        drawMode: 'lines',
        smooth: 0.8
    }
});

image