Home Forums Chart Support Image on Canvas Background

Image on Canvas Background

Viewing 1 post (of 1 total)
  • #27820

    I would like to add an image on the background of the chart. But how to do so?

    var chart = new CanvasJS.Chart("chartContainer", {
                    backgroundColor: "yellow",
                    canvasImage: "online.png",
                    title: {
                        text: "Aantal deelnemers per survival"
                    },
                    subtitles: [{
                            text: "Klik op linkje voor meer info ...",
                            //Uncomment properties below to see how they behave
                            fontColor: "red",
                            fontSize: 20,
                    }],
                    axisY: {
                        title: "Aantal"
                    },
                    axisX: {
                        title: "Jaartal"
                    },
                    data: [
                        {
                            type: "line",
                            toolTipContent: "<a href="{Jaar}"> {label} </a> <hr/>Aantal: {y} <br/> Plaats: <a href="{name}"> {plaats} </a>",
                            
                            dataPoints: [
                                { y: 20, label: "2006", Jaar: "/survival2019/Over2006.html", name: "http://bit.ly/2GJfBiU", plaats: "Cornimont", lineColor: "red" },
                                { y: 15, label: "2007", Jaar: "/survival2019/Over2007.html", name: "http://bit.ly/2PEWyKx", plaats: "Basseilles I, Tenneville", lineColor: "green"},
                                { y: 19, label: "2008", Jaar: "/survival2019/Over2008.html", name: "http://bit.ly/2GVoQhd", plaats: "Werbomont", lineColor: "red" },
                                { y: 14, label: "2009", Jaar: "/survival2019/Over2009.html", name: "http://bit.ly/2LnRVWG", plaats: "Hastière", lineColor: "green" },
                                { y: 23, label: "2010", Jaar: "/survival2019/Over2010.html", name: "https://bit.ly/2PzBqW0", plaats: "La Laiterie, Limerlé", indexLabel: "Meeste", markerColor: "red", markerType: "triangle", lineColor: "red"},
                                { y: 17, label: "2011", Jaar: "/survival2019/Over2011.html", name: "http://bit.ly/2PCV7fI", plaats: "La Ferme, Latour", lineColor: "green" },
                                { y: 22, label: "2012", Jaar: "/survival2019/Over2012.html", name: "http://bit.ly/2vw0RyJ", plaats: "Arbrefontaine", lineColor: "red" },
                                { y: 13, label: "2013", Jaar: "/survival2019/Over2013.html", name: "http://bit.ly/2VBCuy7", plaats: "Chassepierre", lineColor: "green"},
                                { y: 14, label: "2014", Jaar: "/survival2019/Over2014.html", name: "http://bit.ly/2GJfBiU", plaats: "Cornimont", lineColor: "green"},
                                { y: 16, label: "2015", Jaar: "/survival2019/Over2015.html", name: "http://bit.ly/2J020Xg", plaats: "St. Nikolaus, Rursee / Pfadfinderzentrum, Bergheim (DE)", lineColor: "green"},
                                { y: 18, label: "2016", Jaar: "/survival2019/Over2016.html", name: "http://bit.ly/2IPl77d", plaats: "Maison de la village, Vergnies", lineColor: "red" },
                                { y:  8, label: "2017", Jaar: "/survival2019/Over2017.html", name: "http://bit.ly/2ZIPJwe", plaats: "Brûly Ecole, Brûly-de-Pesche", indexLabel: "Minste", markerColor: "red", markerType: "cross", lineColor: "green" },
                                { y: 20, label: "2018", Jaar: "/survival2019/Over2018.html", name: "https://bit.ly/2XZJ7rN", plaats: "Le Fer à Cheval, Bohan", lineColor: "red" },
                                { y: 15, label: "2019", Jaar: "/survival2019/Over2019.html", name: "https://bit.ly/2PzBqW0", plaats: "La Laiterie, Limerlé" }
                            ]
                        }
                    ]
              });
Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.