You must be logged in to post your query.
Home › Forums › StockChart Support › Make transparent background
Hi there. I have a background image that I want to display underneath my chart. My chart has position absolute and I’ve positioned it to be directly on top of my background image. I tried setting background color to transparent, but it still does not show the background image underneath. Could you please let me know if canvas js has such a feature?
@mustadirmahmood,
Please take a look at this JSFiddle for an example on adding background image to the chart.
— Vishwas R Team CanvasJS
Hi. Thanks for the reply. I am actually trying to implement two charts, where the 2nd chart will be on top of the first and both are visible. I have applied backgroundColor: Transparent on the top chart so that the bottom one is visible. The problem I am facing is that I can not align the x-axis of the two charts so that they start and end together. I am guessing that this is due to different lengths of y-axis labels of the two charts.
Please have a look at this fiddle for reference: https://jsfiddle.net/6rw7u8ez/ Please let me know if there is some way to make the two chart’s x-axis align.
Thanks
You can align y-axis of both the charts so that the x-axis of both also gets aligned. This can be done by setting axis margin to top chart based on bounds of bottom chart. chartTop.axisY[0].set("margin", (chartBottom.axisY[0].bounds.x2 - chartBottom.axisY[0].bounds.x1 - chartTop.axisY[0].bounds.x2 + 5));
chartTop.axisY[0].set("margin", (chartBottom.axisY[0].bounds.x2 - chartBottom.axisY[0].bounds.x1 - chartTop.axisY[0].bounds.x2 + 5));
Please take a look at this updated JSFiddle for an example on the same.
You must be logged in to reply to this topic. Login/Register