jqplot, eliminar borde exterior

Cómo eliminar los bordes exteriores de jqplot, por favor, eche un vistazo a la siguiente captura de pantalla. Lo intenté con diferentes opciones y lo busqué, pero no obtuve una solución. introduzca la descripción de la imagen aquí

Aquí está mi código,

plot1 = $.jqplot(container, [data], { title: 'title', animate: true, animateReplot: true, seriesColors:['#00ADEE'], seriesDefaults: { renderer: $.jqplot.BarRenderer, shadow: false }, axesDefaults: { }, highlighter: { tooltipAxes: 'y', show: true, tooltipLocation: 'sw', formatString: ' \ 
test:%s
' }, grid: {borderColor: 'transparent', shadow: false, drawBorder: false, shadowColor: 'transparent'}, axes: { xaxis: { renderer: $.jqplot.CategoryAxisRenderer, ticks:ticks }, yaxis: { max:1000 } } });

Por favor, ayúdame. Gracias por adelantado.


Aquí está el enlace de JsFiddle, quiero eliminar el borde exterior.

Puede registrar una función personalizada en postDrawHooks , que se activará después de la inicialización del complemento.

La idea es utilizar esta función para dibujar un rectángulo de borde blanco en la parte superior del gráfico, que hace que los bordes exteriores sean invisibles.

 $.jqplot.postDrawHooks.push(function() { var $canvasMain = $("#chart1 canvas.jqplot-grid-canvas"), $canvasLines = $("#chart1 canvas.jqplot-series-canvas"), canvasSize = { x: parseInt($canvasLines.attr('width')), y: parseInt($canvasLines.attr('height')) }, ctx = $canvasMain[0].getContext('2d'); ctx.strokeStyle = 'white'; ctx.lineWidth = 6; // 6 to hide shadows and the larger bottom side ctx.rect($canvasLines.position().left, $canvasLines.position().top, canvasSize.x, canvasSize.y + 3); ctx.stroke(); }); 

jsFiddle

Puedes ver que los bordes exteriores se han ido: Salida de muestra

Esto funciona bien, pero personalmente simplemente seguiría y modificaría la fuente para omitir las fronteras exteriores. El complemento tiene doble licencia con GPLv2 y MIT, así que supongo que no hay problemas para ir por ese camino.

Solucion 2

Descubrí que si cambias esto.

 grid: {borderColor: 'transparent', shadow: false, drawBorder: false, shadowColor: 'transparent'}, 

a

 grid: {borderColor: 'white', shadow: false, drawBorder: true}, 

el borde exterior desaparece (algo de lo que hago arriba), pero aún aparecen algunas marcas en el eje x. He configurado showTickMarks: false a ningún éxito.

Ver jsFiddle

El borde exterior no es un borde jqPlot, son las líneas de cuadrícula más externas . Por lo tanto, para eliminar este “borde” deberá desactivar las líneas de cuadrícula.

Puedes desactivar estas líneas de cuadrícula agregando:

 drawGridlines: false 

a sus propiedades de la red por ejemplo

 grid: { drawGridlines: false, borderColor: 'transparent', shadow: false, drawBorder: false, shadowColor: 'transparent' } 

Como tiene habilitada la opción de resaltar, esta será una opción viable para usted, ya que puede ver los valores de los puntos cuando se coloca sobre ellos.

Simplemente configurando drawBorder:false funcionó para mí:

 grid: {drawBorder: false},