You must be logged in to post your query.
Home › Forums › Chart Support › CanvasJS doesn't want to display my chart correctly
Tagged: canvasjs, Curve, Display problem
Hi guys !
I got a problem on my web development using CanvasJS. Indeed, I catch my datas and I normalize these datas to a JSON compatible with CanvasJS. When I use, the example, all is ok, It displays the chart correctly. But when I use my JSON, that doesn’t work anymore. Look at these screenshot, you will understand. It displays the popup with the perfect datas, but doesn’t display the lines and the points which represents the curve.
Thank you !
`{
“title”:{“text”:”Courbes de répartition pour le stimulus : beau”,”fontSize”:30},
“animationEnabled”:true,
“axisX”:{“gridColor”:”Silver”,”tickColor”:”silver”},
“toolTip”:{“shared”:true},
“theme”:”theme2″,
“axisY”:{“gridColor”:”Silver”,”tickColor”:”silver”},
“legend”:{“verticalAlign”:”center”,”horizontalAlign”:”right”},
“data”:[{“type”:”line”,”showInLegend”:true,”lineThickness”:2,”name”:”Joint”,”markerType”:”square”,”color”:”red”,”dataPoints”:[{“label”:”laid”,”y”:”384″},{“label”:”belle”,”y”:”231″},{“label”:”moche”,”y”:”171″},{“label”:”joli”,”y”:”79″},{“label”:”temps”,”y”:”56″},{“label”:”paysage”,”y”:”43″},{“label”:”magnifique”,”y”:”37″},{“label”:”soleil”,”y”:”36″},{“label”:”agréable”,”y”:”34″},{“label”:”art”,”y”:”34″},{“label”:”bien”,”y”:”21″},{“label”:”esthétique”,”y”:”20″},{“label”:”gosse”,”y”:”19″},{“label”:”grand”,”y”:”19″},{“label”:”parleur”,”y”:”18″},{“label”:”beauté”,”y”:”16″},{“label”:”garçon”,”y”:”14″},{“label”:”homme”,”y”:”13″},{“label”:”visage”,”y”:”13″},{“label”:”nature”,”y”:”12″},{“label”:”vilain”,”y”:”12″},{“label”:”bon”,”y”:”11″},{“label”:”plaisant”,”y”:”11″},{“label”:”bel”,”y”:”10″},{“label”:”comme un dieu”,”y”:”10″},{“label”:”bonhomme”,”y”:”9″},{“label”:”élégant”,”y”:”8″},{“label”:”frère”,”y”:”8″},{“label”:”plaisir”,”y”:”8″},{“label”:”relatif”,”y”:”8″},{“label”:”subjectif”,”y”:”8″},{“label”:”tableau”,”y”:”8″},{“label”:”charmant”,”y”:”7″},{“label”:”ciel”,”y”:”7″},{“label”:”gentil”,”y”:”6″},{“label”:”sourire”,”y”:”6″},{“label”:”vrai”,”y”:”6″},{“label”:”contemplation”,”y”:”5″},{“label”:”éphémère”,”y”:”5″},{“label”:”fils”,”y”:”5″},{“label”:”mec”,”y”:”5″},{“label”:”merveilleux”,”y”:”5″},{“label”:”séduisant”,”y”:”5″},{“label”:”superbe”,”y”:”5″},{“label”:”Adonis”,”y”:”4″},{“label”:”comme un cœur”,”y”:”4″},{“label”:”enfant”,”y”:”4″},{“label”:”père”,”y”:”4″},{“label”:”regard”,”y”:”4″},{“label”:”sublime”,”y”:”4″}]},{“type”:”line”,”showInLegend”:true,”lineThickness”:2,”name”:”France”,”markerType”:”square”,”color”:”black”,”dataPoints”:[{“label”:”laid”,”y”:”103″},{“label”:”belle”,”y”:”68″},{“label”:”moche”,”y”:”77″},{“label”:”joli”,”y”:”25″},{“label”:”temps”,”y”:”20″},{“label”:”paysage”,”y”:”12″},{“label”:”magnifique”,”y”:”9″},{“label”:”soleil”,”y”:”8″},{“label”:”agréable”,”y”:”9″},{“label”:”art”,”y”:”16″},{“label”:”bien”,”y”:”5″},{“label”:”esthétique”,”y”:”10″},{“label”:”gosse”,”y”:”7″},{“label”:”grand”,”y”:”4″},{“label”:”parleur”,”y”:”4″},{“label”:”beauté”,”y”:”3″},{“label”:”garçon”,”y”:”2″},{“label”:”homme”,”y”:”3″},{“label”:”visage”,”y”:”4″},{“label”:”nature”,”y”:”2″},{“label”:”vilain”,”y”:”5″},{“label”:”bon”,”y”:”4″},{“label”:”plaisant”,”y”:”2″},{“label”:”bel”,”y”:”5″},{“label”:”comme un dieu”,”y”:”5″},{“label”:”élégant”,”y”:”3″},{“label”:”frère”,”y”:”1″},{“label”:”plaisir”,”y”:”1″},{“label”:”relatif”,”y”:”4″},{“label”:”subjectif”,”y”:”4″},{“label”:”tableau”,”y”:”1″},{“label”:”charmant”,”y”:”4″},{“label”:”ciel”,”y”:”4″},{“label”:”gentil”,”y”:”2″},{“label”:”sourire”,”y”:”2″},{“label”:”vrai”,”y”:”4″},{“label”:”contemplation”,”y”:”1″},{“label”:”éphémère”,”y”:”1″},{“label”:”fils”,”y”:”2″},{“label”:”mec”,”y”:”1″},{“label”:”merveilleux”,”y”:”1″},{“label”:”séduisant”,”y”:”4″},{“label”:”superbe”,”y”:”2″},{“label”:”enfant”,”y”:”1″},{“label”:”père”,”y”:”1″},{“label”:”sublime”,”y”:”2″}]},{“type”:”line”,”showInLegend”:true,”lineThickness”:2,”name”:”Belgique”,”markerType”:”square”,”color”:”green”,”dataPoints”:[{“label”:”laid”,”y”:”124″},{“label”:”belle”,”y”:”64″},{“label”:”moche”,”y”:”27″},{“label”:”joli”,”y”:”30″},{“label”:”temps”,”y”:”7″},{“label”:”paysage”,”y”:”7″},{“label”:”magnifique”,”y”:”13″},{“label”:”soleil”,”y”:”9″},{“label”:”agréable”,”y”:”8″},{“label”:”art”,”y”:”9″},{“label”:”bien”,”y”:”4″},{“label”:”esthétique”,”y”:”5″},{“label”:”gosse”,”y”:”3″},{“label”:”grand”,”y”:”6″},{“label”:”parleur”,”y”:”3″},{“label”:”beauté”,”y”:”5″},{“label”:”garçon”,”y”:”7″},{“label”:”homme”,”y”:”2″},{“label”:”visage”,”y”:”3″},{“label”:”nature”,”y”:”7″},{“label”:”bon”,”y”:”2″},{“label”:”plaisant”,”y”:”1″},{“label”:”bel”,”y”:”1″},{“label”:”comme un dieu”,”y”:”3″},{“label”:”élégant”,”y”:”1″},{“label”:”frère”,”y”:”1″},{“label”:”plaisir”,”y”:”1″},{“label”:”relatif”,”y”:”1″},{“label”:”subjectif”,”y”:”3″},{“label”:”tableau”,”y”:”4″},{“label”:”charmant”,”y”:”2″},{“label”:”gentil”,”y”:”2″},{“label”:”sourire”,”y”:”1″},{“label”:”vrai”,”y”:”1″},{“label”:”éphémère”,”y”:”1″},{“label”:”fils”,”y”:”1″},{“label”:”mec”,”y”:”2″},{“label”:”merveilleux”,”y”:”1″},{“label”:”superbe”,”y”:”3″},{“label”:”Adonis”,”y”:”2″},{“label”:”père”,”y”:”1″},{“label”:”regard”,”y”:”3″}]},{“type”:”line”,”showInLegend”:true,”lineThickness”:2,”name”:”Suisse”,”markerType”:”square”,”color”:”grey”,”dataPoints”:[{“label”:”laid”,”y”:”56″},{“label”:”belle”,”y”:”36″},{“label”:”moche”,”y”:”65″},{“label”:”joli”,”y”:”10″},{“label”:”temps”,”y”:”9″},{“label”:”paysage”,”y”:”10″},{“label”:”magnifique”,”y”:”9″},{“label”:”soleil”,”y”:”8″},{“label”:”agréable”,”y”:”5″},{“label”:”art”,”y”:”3″},{“label”:”bien”,”y”:”6″},{“label”:”esthétique”,”y”:”1″},{“label”:”gosse”,”y”:”8″},{“label”:”grand”,”y”:”1″},{“label”:”parleur”,”y”:”4″},{“label”:”beauté”,”y”:”1″},{“label”:”garçon”,”y”:”2″},{“label”:”homme”,”y”:”1″},{“label”:”visage”,”y”:”1″},{“label”:”vilain”,”y”:”7″},{“label”:”plaisant”,”y”:”1″},{“label”:”bel”,”y”:”3″},{“label”:”comme un dieu”,”y”:”1″},{“label”:”bonhomme”,”y”:”1″},{“label”:”élégant”,”y”:”2″},{“label”:”plaisir”,”y”:”1″},{“label”:”relatif”,”y”:”1″},{“label”:”subjectif”,”y”:”1″},{“label”:”tableau”,”y”:”1″},{“label”:”charmant”,”y”:”1″},{“label”:”ciel”,”y”:”2″},{“label”:”gentil”,”y”:”1″},{“label”:”éphémère”,”y”:”1″},{“label”:”fils”,”y”:”1″},{“label”:”mec”,”y”:”1″},{“label”:”enfant”,”y”:”1″},{“label”:”père”,”y”:”1″},{“label”:”sublime”,”y”:”2″}]},{“type”:”line”,”showInLegend”:true,”lineThickness”:2,”name”:”Canada”,”markerType”:”square”,”color”:”blue”,”dataPoints”:[{“label”:”laid”,”y”:”101″},{“label”:”belle”,”y”:”63″},{“label”:”moche”,”y”:”2″},{“label”:”joli”,”y”:”14″},{“label”:”temps”,”y”:”20″},{“label”:”paysage”,”y”:”14″},{“label”:”magnifique”,”y”:”6″},{“label”:”soleil”,”y”:”11″},{“label”:”agréable”,”y”:”12″},{“label”:”art”,”y”:”6″},{“label”:”bien”,”y”:”6″},{“label”:”esthétique”,”y”:”4″},{“label”:”gosse”,”y”:”1″},{“label”:”grand”,”y”:”8″},{“label”:”parleur”,”y”:”7″},{“label”:”beauté”,”y”:”7″},{“label”:”garçon”,”y”:”3″},{“label”:”homme”,”y”:”7″},{“label”:”visage”,”y”:”5″},{“label”:”nature”,”y”:”3″},{“label”:”bon”,”y”:”5″},{“label”:”plaisant”,”y”:”7″},{“label”:”bel”,”y”:”1″},{“label”:”comme un dieu”,”y”:”1″},{“label”:”bonhomme”,”y”:”8″},{“label”:”élégant”,”y”:”2″},{“label”:”frère”,”y”:”6″},{“label”:”plaisir”,”y”:”5″},{“label”:”relatif”,”y”:”2″},{“label”:”tableau”,”y”:”2″},{“label”:”ciel”,”y”:”1″},{“label”:”gentil”,”y”:”1″},{“label”:”sourire”,”y”:”3″},{“label”:”vrai”,”y”:”1″},{“label”:”contemplation”,”y”:”4″},{“label”:”éphémère”,”y”:”2″},{“label”:”fils”,”y”:”1″},{“label”:”mec”,”y”:”1″},{“label”:”merveilleux”,”y”:”3″},{“label”:”séduisant”,”y”:”1″},{“label”:”Adonis”,”y”:”2″},{“label”:”comme un cœur”,”y”:”4″},{“label”:”enfant”,”y”:”2″},{“label”:”père”,”y”:”1″},{“label”:”regard”,”y”:”1″}]}]}
This is an example of JSON I can have.
This is the pictures that show my problem. As you can see the JSON object is ok, but I can’t see the squares and the lines of my chart ! The squares at the bottom of the chart represent the value 0. The others don’t exist. Thank you for your help !
We tried but are unable to reproduce the issue at our end. Can you please let us know the version of CanvasJS that you’re using? Also, can you please mention your browser version along with OS?
You can also try disabling hardware acceleration in your browser and check if it makes any difference.
—-
Bivek Singh,
Team CanvasJS
You seem to using string for Y
value which should be number. Changing the Y value should work fine.
—-
Bivek Singh,
Team CanvasJS
Oh man, you are so good, thank you !! You are the best !
Have a good day !
Tagged: canvasjs, Curve, Display problem
You must be logged in to reply to this topic.