How to change Dimple js gridlines styles - javascript

I want to change the style of Yaxis grid lines to dashlines. Could anyone help me on this. Thanks..

I know this is old but this might help someone looking to change the gridline color.
The example dimplejs website gives does not work as you pointed out.
This is because the stroke attribute will be overridden by the line STYLE.
This is from the dimplejs webpage and does change the stroke but does not display the new color.
myAxis.gridlineShapes.selectAll("line").attr("stroke", "#FF0000");
Change the style instead of the stroke attribute like this.
myAxis.gridlineShapes.selectAll("line").style("stroke", "#FF0000");

Related

how to change point style legend to diamond in chart js

I want to change the point style of my legend to diamond but don't know how to do it. I am attaching the jsfiddle file in the comment.
The pointStyle should be updated to rectRot instead of rect. Please read more about it here
Updated JSFiddle
Edit: For adding a '%' sign at the end of each tooltip label, add a tooltip callback as shown in the following JSFiddle

Highcharts paint zero axis black

I have a Highchart bar chart with negative values (with the bars then going downwards). Now I would like to paint a black line for y=0 like so: .
I haven't found a trivial way to do this and I would like to avoid directly modifing the SVG or adding a fake line chart or something. Maybe someone knows better way? I've already played around with (minor)tickInterval and (minor)gridLineColor but that wouldn't solve my problem.
you can use plot lines for this like shown in this example http://jsfiddle.net/4rpNU/
yAxis:{
plotLines:{}
}
here is the api reference for it http://api.highcharts.com/highcharts#yAxis.plotLines
Hope this will be useful for you :)

How to change the selection tip of custom cursor using css

In my website, I am using a color picker jquery plugin for picking colors from an image.I have change the cursor to an eyedropper icon using CSS. Right now,while clicking on the image,the color pointed by the upper part of cursor is picked.Since it is eyedrope cursor, i need to use its lower part to pick colors. Please help me out.
This is the cursoram that using :
Thanks
cursor:url(http://www.yourwebsite.com/yourcursorname.cur) 0 16,default;
Tell it where to set the x y coords in your css when declaring the cursor.

jVectorMap change SVG stroke color

Using jVectorMap on a site and would like to change the stroke color of state borders within the USA map. Have tried inserting a stroke color within each states coords within the path to no avail.
Has anyone been able to do such thing?
Appears you can add the stroke in the stylesheet.
.jvectormap-region {
stroke: white;
stroke-width: 2;
}
Unfortunately you can't achieve this easily now without modifying the code of the jVectorMap.
Just add the following code around line 123 of jquery.vector-map.js:
node.setAttribute('d', config.path);
node.setAttribute('stroke', '#000000'); // Whatever color you like!
node.setFill = function(color)...
Greetings!
Another question: my VML Fallback doesn't seem to work. The path coordinates are from an SVG created by Adobe Illustrator. Has anyone the same problem or can give me a solution which programm to use to create the path data?

Highcharts problems: variable legend height

I have to set the height & width of the Highcharts placeholder. But the data to be displayed is variable. When the series names(long name) come to much more. The lengend height grows too high and hide the chart.
How could I solve this problem? Hoping to get some help.
I faced the same issue as you have mentioned. I was setting chart height and marginBottom property for the chart. I removed the marginBotton property and its working fine. AS your legend grows, the chart canvas area gets adjusted by itself and the legend does not overlap with the plot area
After your chart loads.. put this in your code..
$('.highcharts-legend').attr('transform', 'translate(50,400)')
But It will still move if you resize the browser...
Ill let you know if I figure it out..
As you can see here the release 2.2.4 introduces legend paging.
You can custom it following the reference.
As you add your series to the chart just stop adding them to the legend after a certain point (eg after 5) with the following option:
showInLegend: false
docs: http://www.highcharts.com/ref/#plotOptions-series
demo: http://jsfiddle.net/7Mmee/14/
see this jfiddle link.this is fiddle and highchart links
http://jsfiddle.net/highcharts/B9L2b/
I think this will solve your problem.

Categories