The problem is that your quotes are being rendered as the ASCII HTML code instead of the character. You need to make them render as the actual character and not the HTML-encoded character.
I developed a Ruby on Rails application using the flash-based Annotated Time Line visualization. I used what is now an obsolete plugin (google_visualr), which nonetheless worked until recently. Now nothing is shown.
It was suggested that the problem is an http/https mismatch in fetching "http://www.google.com/jsapi". I don't think so; the problem exists in development on a page using http.
If anyone can shed any light on this, I (and my client) would be most appreciative.
Here is the controller code, for those familiar with Rails (now things are done with a separate data object, but this is the old way):
@chart = GoogleVisualr::AnnotatedTimeLine.new
@chart.add_column('datetime', 'Date')
@chart.add_column('number', 'Temperature')
@chart.add_rows(@data)
options = { :displayAnnotations => true, :thickness => 1, :zoomStartTime => (estring - 5.days), :zoomEndTime => estring }
options.each_pair do | key, value |
@chart.send "#{key}=", value
end
Here is the view code (HAML, mainly it creates a div and calls the 'render' method on the @chart object):
#chart{:style => 'width:770px;height:400px;margin-left:15px;'}
= @chart.render('chart')
Here is the HTML generated:
<div id='chart' style='width:770px;height:400px;margin-left:15px;'> <script type="text/javascript">
google.load('visualization','1', {packages: ['annotatedtimeline'], callback: function() {
var chart_data = new google.visualization.DataTable();
chart_data.addColumn('datetime', 'Date', '');
chart_data.addColumn('number', 'Temperature', '');
chart_data.addRow( [new Date(2012, 6, 30, 15, 46, 0),25.5] );
chart_data.addRow( [new Date(2012, 6, 30, 16, 16, 0),26.0] );
chart_data.addRow( [new Date(2012, 6, 30, 16, 46, 0),26.5] );
chart_data.addRow( [new Date(2012, 6, 30, 17, 16, 0),27.5] );
chart_data.addRow( [new Date(2012, 6, 30, 17, 46, 0),28.0] );
chart_data.addRow( [new Date(2012, 6, 30, 18, 16, 0),28.5] );
chart_data.addRow( [new Date(2012, 6, 30, 18, 46, 0),28.5] );
var chart = new google.visualization.AnnotatedTimeLine(document.getElementById('chart'));
chart.draw(chart_data, {displayAnnotations:true,thickness:1,zoomStartTime:new Date(2012, 7, 1, 9, 16, 0),zoomEndTime:new Date(2012, 7, 6, 9, 16, 0)});
}});
</script>
</div>