Home forums Using CanvasJS Possible to recreate this bar chart with image overlays?

This topic contains 5 replies, has 2 voices, and was last updated by  Shashi Ranjan 1 week, 6 days ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #27268

    I’m trying to create a bar chart that looks like thisWhat bar chart should look like, with images placed between the y-axis labels and the bars. The images should stay in that white space at all screen sizes. I was able to reproduce this using a stacked bar chart to fake the white space, but the images pop out of place at screen sizes where the chart title extends across more than one line. Is there a way to adjust the image position based on the size of the headline? Or maybe there’s a better approach to this?

    Thanks!

    #27274

    @foreignpolicy,

    Please take a look at this JSFiddle.


    Shashi Ranjan
    Team CanvasJS

    #27276

    Thanks! That seems promising, but it’s not working in my code the same way as in your JSFiddle. My icons move out of place the moment the screen is resized and they still move when the chart title extends across more than one line.

    You can have a look here.

    #27303

    @foreignpolicy,

    The JSFiddle you have shared doesn’t seem to be working. However, we are trying to reproduce the issue at our end and will get back to you at the earliest.


    Shashi Ranjan
    Team CanvasJS

    #27327

    What about positioning the images to the left of the names in the y-axis? Would that be any easier?

    #27355

    @foreignpolicy,

    Please take a look at this JSFiddle.


    Shashi Ranjan
    Team CanvasJS

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.