Graphs highcharts plotting the dates which are the values valid for the month

Asked

Viewed 150 times

0

I’m charting a graph that the date entries don’t match with the plotting. Example when I enter the date information 10/12/2017 it plots how (January 10, 2017) to correct this?

Loading is done through the database the code used:

<script type="text/javascript">
$(document).ready (function (data) {

    Highcharts.chart('container-grafico1', {
        chart: {
            zoomType: 'x'
        },
        title: {
            text: 'Temperaturas Registradas'
        },
        subtitle: {
            text: document.ontouchstart === undefined ?
                'Clique e selicione a area do grafico que deseja dar o zoom': 'Clique e selicione a area do grafico que deseja dar o zoom'
        },
        xAxis: {
            type: 'datetime'
        },
        yAxis: {
            title: {
                text: 'Temperaturas em Graus Celsius'
            }
        },
        legend: {
            enabled: false
        },
        plotOptions: {
            area: {
                fillColor: {
                    linearGradient: {
                        x1: 0,
                        y1: 0,
                        x2: 0,
                        y2: 1
                    },
                    stops: [
                        [0, Highcharts.getOptions().colors[0]],
                        [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
                    ]
                },
                marker: {
                    radius: 2
                },
                lineWidth: 1,
                states: {
                    hover: {
                        lineWidth: 1
                    }
                },
                threshold: null
            }
        },

        series: [{
            type: 'area',
            name: 'temperatura da água',
            data: [
				{% for i in temperatura_db %}
					[Date.UTC({{ i[2].split('-')|join(', ') }}, {{ i[3].split(':')|join(', ') }}),{{i[1]|safe}}],
				{% endfor %}
         ]
        }]
    });

});
</script>
    <div class="container">
	<div class="container-fluid">
		<div class="jumbotron text-center"style="color:white">
		<div><h1> Graficos </h1></div>	
		
		<div>
		<form>
			<div id="container-grafico1"></div>
		</form>
		</div>
</div>
</div>
</div>

Corrected publication..

  • try to define what comes from the database as a string in js a (cast). https://www.w3schools.com/js/js_type_conversion.asp

  • Kaue Arima the statements of js are those?! var json = {}; json.Chart = Chart; json.title = title; json.Subtitle = Subtitle; json.tooltip = tooltip; json.Xaxis = Xaxis; json.yAxis = yAxis; json.series = series; json.plotOptions = plotOptions; $$('#container-graphic1'). highcharts(json);

  • I’m not sure which part of the code I should tamper with to solve this problem!

1 answer

0

I need to see the whole code, but when I had this problem I did so:

Highcharts.chart('container', {

title: {
    text: 'Solar Employment Growth by Sector, 2010-2016'
},

subtitle: {
    text: 'Source: thesolarfoundation.com'
},

yAxis: {
    title: {
        text: 'Number of Employees'
    },
    categorias: [ String('10/01/03'),...]
},...
  • as I do to appear the code as you showed in the previous comment?

  • have to have some tag before and after ?! which tag should I use to show the formatted code equal to yours?

Browser other questions tagged

You are not signed in. Login or sign up in order to post.