5

I'm currently trying to make a frequency analyzer using web technologies, especially Meteor.

For now, I tried to use the Google Charts library that create SVG pictures. The chart needs to be refreshed about 10 times by second and the performance aren't satisfying. It takes all the CPU resource.

I'm a bit new to web development (especially in graphical and performances issues) so if you could point into the right direction to make my research, I'd appreciate it.

3 Answers 3

4

I ended up using the library CanvasJs which appears to be one of the fastest. There is an option interactivityEnabled: false to disable interactions with the chart which increase performance.

Even if there is yet no direct Meteor integration, just put the js file in the ./client/compatibility and it works fine.

3

You could very easily accomplish this with ZingChart. We don't have a Meteor integration (yet), but the demo below should be a good start for you. Run the snippet below to see it live.

I'm on the ZingChart team! Let me know if you have questions.

var MAXVALUES = 100;
var myConfig = {
 type: "line", 
 series : [
   {
     values : []
   }
 ]
};

zingchart.render({ 
  id : 'myChart', 
  data : myConfig, 
  height: 400, 
  width: 600 
});


var myValues = [];

setInterval(function(){
  myValues.push( Math.floor(Math.random() * 10 ) );
  
  if(myValues.length == MAXVALUES+1){
    myValues.shift();
  }
  console.log(myValues)
  zingchart.exec('myChart', 'setseriesvalues', {
    values : [myValues]
  })
},60)
<script src="http://cdn.zingchart.com/zingchart.min.js"></script>
<div id='myChart'></div>

0

Use the canvas element. You should be able to get 60 per second and if it's a audio source the Audio API provides a DSP for spectral analysis.

Here is an example audio spectrum visualizer

3
  • The analyzer is not for audio sources but thanks, I will look in this direction.
    – c.censier
    Nov 5, 2015 at 15:41
  • Audio sources don't have to be audio, But you are limited to the types of transforms you can apply.
    – Blindman67
    Nov 5, 2015 at 15:46
  • I don't think I can use the Audio API, I will display raw data got from a radio analyzer.
    – c.censier
    Nov 5, 2015 at 15:55

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.