update the examples page...

(set height 240px)

(set height 280px)

(set width 900px)

(chart/scatterplot

        data-x (csv "tests/testdata/areadata2.csv" x)

        data-y (csv "tests/testdata/areadata2.csv" z)

        data-y-low (csv "tests/testdata/areadata2.csv" y)

        color 1)

        color 2)

    areas (

        data-x (csv "tests/testdata/areadata2.csv" x)

        data-y (csv "tests/testdata/areadata2.csv" z2)

        data-y-low (csv "tests/testdata/areadata2.csv" y2)

        color 3)

    legend-overlay (

        position (bottom left)

        position (top right)

        background #fff

        border none

        margin 0

        padding 0

        item-column-padding 1.4em

        item-flow on

        item (label "Series A" color 1)

        item (label "Series A" color 2)

        item (label "Series B" color 3)))

<svg xmlns="http://www.w3.org/2000/svg" width="960.000000" height="300.000000" viewBox="0 0 960 300">

  <rect width="960.000000" height="300.000000" fill="#ffffff"/>

  <path fill="#4572a7" d="M59.8375 53.216 L170.524 43.5787 L281.211 31.532 L502.585 55.6253 L723.959 84.5373 L945.333 55.6253 L945.333 212.232 L723.959 178.501 L502.585 192.957 L281.211 183.32 L170.524 207.413 L59.8375 217.051 "/>

  <path fill="#aa4643" d="M59.8375 53.216 L170.524 43.5787 L281.211 31.532 L502.585 55.6253 L723.959 84.5373 L945.333 55.6253 L945.333 212.232 L723.959 178.501 L502.585 192.957 L281.211 183.32 L170.524 207.413 L59.8375 217.051 "/>

  <path fill="#db843d" d="M59.8375 60.444 L170.524 55.6253 L281.211 43.5787 L502.585 70.0813 L723.959 103.812 L945.333 62.8533 L945.333 178.501 L723.959 151.999 L502.585 183.32 L281.211 171.273 L170.524 183.32 L59.8375 192.957 "/>

  <path fill="#ffffff" d="M74.5042 199.467 L260.865 199.467 L260.865 240.933 L74.5042 240.933 L74.5042 199.467 "/>

  <path stroke-width="1.000000" stroke="#000000" fill="none" d="M74.5042 199.467 L260.865 199.467 "/>

  <path stroke-width="1.000000" stroke="#000000" fill="none" d="M260.865 199.467 L260.865 240.933 "/>

  <path stroke-width="1.000000" stroke="#000000" fill="none" d="M74.5042 240.933 L260.865 240.933 "/>

  <path stroke-width="1.000000" stroke="#000000" fill="none" d="M74.5042 199.467 L74.5042 240.933 "/>

  <text x="105.304167" y="225.200000" fill="#000000" font-size="14.666667" font-family="Arial,Helvetica,'Helvetica Neue',sans-serif" font-weight="500.000000">Series A</text>

  <path fill="#4572a7" d="M96.8708 220.2 M85.8708 220.2 a5.5 5.5 0 1 0 11 0 a5.5 5.5 0 1 0 -11 0 "/>

  <text x="190.744792" y="225.200000" fill="#000000" font-size="14.666667" font-family="Arial,Helvetica,'Helvetica Neue',sans-serif" font-weight="500.000000">Series B</text>

  <path fill="#db843d" d="M182.311 220.2 M171.311 220.2 a5.5 5.5 0 1 0 11 0 a5.5 5.5 0 1 0 -11 0 "/>

  <path fill="#ffffff" d="M782.44 14.6667 L945.333 14.6667 L945.333 32.6667 L782.44 32.6667 L782.44 14.6667 "/>

  <text x="798.572917" y="28.666667" fill="#000000" font-size="14.666667" font-family="Arial,Helvetica,'Helvetica Neue',sans-serif" font-weight="500.000000">Series A</text>

  <path fill="#aa4643" d="M790.14 23.6667 M779.14 23.6667 a5.5 5.5 0 1 0 11 0 a5.5 5.5 0 1 0 -11 0 "/>

  <text x="889.880208" y="28.666667" fill="#000000" font-size="14.666667" font-family="Arial,Helvetica,'Helvetica Neue',sans-serif" font-weight="500.000000">Series B</text>

  <path fill="#db843d" d="M881.447 23.6667 M870.447 23.6667 a5.5 5.5 0 1 0 11 0 a5.5 5.5 0 1 0 -11 0 "/>

  <path stroke-width="1.333333" stroke="#000000" fill="none" d="M59.8375 255.6 L945.333 255.6 "/>

  <path stroke-width="1.333333" stroke="#000000" fill="none" d="M59.8375 250.267 L59.8375 255.6 "/>

  <path stroke-width="1.333333" stroke="#000000" fill="none" d="M148.387 250.267 L148.387 255.6 "/>

(set height 260px)

(plot

    limit-x (-12 22)

    limit-y (-35 55)