*50,000
On Wednesday, January 3, 2018 at 5:26:16 PM UTC, Lucas Heasman wrote:
>
> Hi Daniel,
>
> I found a different way of where you initialise the chart options then
> only update the points.
>
> var chart, dashboard, rangeSlider, allData;
>
> function allChart() {
>
> //Turn the data variable into a data table with headings for datetime and
> all the silos
> allData = new google.visualization.DataTable();
> allData.addColumn("datetime", "Time");
> for (var i = 0; i<siloArray.length; i++) {
> allData.addColumn("number", siloArray[i]);
> }
>
> //Set the location of the dashboard
> dashboard = new google.visualization.Dashboard(document.getElementById(
> "sDashboard"))
>
> //Define the options for the rangeSlider
> rangeSlider = new google.visualization.ControlWrapper({
> controlType: "ChartRangeFilter",
> containerId: "sChartFilter",
> options: {
> filterColumnLabel: "Time",
> ui: {
> chartOptions: {
> height:50,
> width: "100%",
> colors: colors,
> chartArea: {
> width: "90%"
> },
> hAxis: {
>
> }
> },
> snapToData: true
> }
> },
> });
>
> //Define the options for the chart
> chart = new google.visualization.ChartWrapper({
> chartType: "LineChart",
> containerId: "sChart",
> options: {
> width: "100%",
> height: 560,
> focusTarget: "category",
> colors: colors,
> legend: {
> position: "top",
> maxLines: 5,
> },
> title: "Number of Sessions based on Time",
> chartArea: {
> top: 100,
> bottom: 60,
> width: "90%",
> height: "65%"
> },
> hAxis: {
> title: "Time",
> viewWindowMode: "maximized",
> },
> vAxis: {
> title: "Number of Sessions",
> format: "0",
> maxValue: 6,
> minValue: 0
> },
> }
> });
> //Bind all the pieces of the dashboard together and draw a dashboard with
> no data
> dashboard.bind([rangeSlider], [chart]);
> dashboard.draw(allData);
> }
>
> //Create a function for updating the dashboard with new data every 5
> seconds
> function allUpdate(newData) {
>
> //Add the new data as a row to the data table
> allData.addRows(newData);
>
> //Draw the dashboard with new data
> dashboard.draw(allData);
>
> //Work around for a bug causing data to only show in the slider, sets the
> max range between now and a month ago
> rangeSlider.setState({end:new Date(), start: new Date(new Date().setMonth(
> new Date().getMonth()-1))});
> }
>
> So I run the allChart function to set it up and then run the allUpdate
> function whenever I want to add new points on the end, I do this every 5
> seconds and have got up to nearly 5000 points multiple times, there still
> seems to be a memory issue but it is much slower.
>
> Hope this helps,
> Lucas
>
> On Thursday, December 28, 2017 at 1:18:14 PM UTC, Daniel Arruda wrote:
>>
>> Same issue here,
>>
>> I m using ng2-google-charts for Angular 2+, every 5s i refresh my chart,
>> the memory slowly increases until the browser crashes..
>>
>> Any hint?
>>
>> Daniel
>>
>> Em segunda-feira, 11 de dezembro de 2017 14:44:16 UTC-2, Lucas Heasman
>> escreveu:
>>>
>>> Hi everyone,
>>>
>>> I am fairly new to coding and have created a webpage with multiple
>>> dashboards on it. However over time the memory keeps increasing, I have
>>> pinned it down to when I draw each dashboard. I am doing this every 5
>>> seconds.
>>>
>>> Here is my code for one of the dashboards:
>>>
>>> var chart, dashboard, rangeSlider, prevChart, prevDash, prevSlide;
>>> function allChart() {
>>> var data = new google.visualization.DataTable();
>>> data.addColumn('datetime', 'Time');
>>> for (var i = 0; i<siloArray.length; i++) {
>>> data.addColumn('number', siloArray[i]);
>>> }
>>>
>>> data.addRows(allChartData);
>>>
>>> var sliderOptions = {
>>> controlType: 'ChartRangeFilter',
>>> containerId: 'sChartFilter',
>>> options: {
>>> filterColumnLabel: 'Time',
>>> ui: {
>>> chartOptions: {
>>> height:50,
>>> width: '100%',
>>> colors: colors,
>>> chartArea: {
>>> width: '90%'
>>> },
>>> hAxis: {
>>>
>>> }
>>> },
>>> snapToData: true
>>> }
>>> },
>>> }
>>>
>>> var allOptions = {
>>> chartType: 'LineChart',
>>> containerId: 'sChart',
>>> options: {
>>> width: '100%',
>>> height: 560,
>>> focusTarget: 'category',
>>> colors: colors,
>>> legend: {
>>> position: 'top',
>>> maxLines: 5,
>>> },
>>> title: 'Number of Sessions based on Time',
>>> chartArea: {
>>> top: 100,
>>> bottom: 60,
>>> width: '90%',
>>> height: '65%'
>>> },
>>> hAxis: {
>>> title: 'Time',
>>> },
>>> vAxis: {
>>> title: 'Number of Sessions',
>>> format: '0',
>>> maxValue: 6,
>>> minValue: 0
>>> },
>>> },
>>> view:{
>>> }
>>> }
>>>
>>> var colArray = [];
>>> for (var j = 0; j<siloArray.length; j++) {
>>> colArray.push(j);
>>> }
>>> allOptions.view.columns = colArray;
>>>
>>> if (allChartData.length == 1) {
>>> allOptions.options.hAxis.ticks = [allChartData[0][0]];
>>> sliderOptions.options.ui.chartOptions.hAxis.ticks = [allChartData[0][0]]
>>> ;
>>> }
>>>
>>> prevChart = chart;
>>> prevDash = dashboard;
>>> prevSlide = rangeSlider;
>>>
>>> rangeSlider = new google.visualization.ControlWrapper(sliderOptions);
>>> chart = new google.visualization.ChartWrapper(allOptions);
>>> dashboard = new google.visualization.Dashboard(document.getElementById(
>>> "sDashboard")).
>>> bind([rangeSlider], [chart]).
>>>
>>> draw(data);
>>>
>>> if (prevDash) {
>>> prevDash.visualization.dispose();
>>> prevChart.visualization.clearChart();
>>> prevSlide.visualization.dispose();
>>> }
>>> }
>>>
>>> Any help is appreciated.
>>> Lucas
>>>
>>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit
https://groups.google.com/d/msgid/google-visualization-api/232564de-3218-496c-b04b-f9344bc8898c%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
