derMart · July 10, 2012 10:27
diff --git a/gistfile1.html b/gistfile1.html
 <!DOCTYPE html>
 <html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <title>Opera Flicker Bug</title>
    <script src="http://openlayers.org/dev/OpenLayers.js"></script>
    <script type="text/javascript">
        var map, layer;
        function init(){
            map = new OpenLayers.Map( 'map');
            layer = new OpenLayers.Layer.OSM( "Simple OSM Map");
            map.addLayer(layer);
            map.setCenter(
                new OpenLayers.LonLat(0, 0).transform(
                    new OpenLayers.Projection("EPSG:4326"),
                    map.getProjectionObject()
                ), 5
            );
            
            var vector = new OpenLayers.Layer.Vector("features",{renderers:['Canvas']});
            map.addLayer(vector);
            var features = [];
            for(var i=0;i<10000;i++) {
                var point = new OpenLayers.Geometry.Point(0,0);
                var f = new OpenLayers.Feature.Vector(point);
                features.push(f);
            
            }
            vector.addFeatures(features);            
        }
    </script>
  </head>
  <body onload="init()">
    <h1 id="title">Opera Flicker Bug</h1>

    <div id="map" style="width:600px;height:400px;"></div>

    <div id="docs">
        <p>Pan the Map in Opera to see the Flickering.</p> 
        <p>Possible explanation:</p>
        <p>While Dragging the canvas div moves. After the dragging is complete the canvas div is moved back to ist original place.
        After the div is in its originial position, the features on the canvas are redrawn.</p>
        <p>Every Browser except Opera is not updating/rendering the screen while javascript is executing.
        Opera on the other hand does. So it updates the screen after the canvas div is moved to its original place but before the features are redrawn.</p>
    </div>
  </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<title>Opera Flicker Bug</title>
	<script src="http://openlayers.org/dev/OpenLayers.js"></script>
	<script type="text/javascript">
	var map, layer;
	function init(){
	map = new OpenLayers.Map( 'map');
	layer = new OpenLayers.Layer.OSM( "Simple OSM Map");
	map.addLayer(layer);
	map.setCenter(
	new OpenLayers.LonLat(0, 0).transform(
	new OpenLayers.Projection("EPSG:4326"),
	map.getProjectionObject()
	), 5
	);

	var vector = new OpenLayers.Layer.Vector("features",{renderers:['Canvas']});
	map.addLayer(vector);
	var features = [];
	for(var i=0;i<10000;i++) {
	var point = new OpenLayers.Geometry.Point(0,0);
	var f = new OpenLayers.Feature.Vector(point);
	features.push(f);

	}
	vector.addFeatures(features);
	}
	</script>
	</head>
	<body onload="init()">
	<h1 id="title">Opera Flicker Bug</h1>

	<div id="map" style="width:600px;height:400px;"></div>

	<div id="docs">
	<p>Pan the Map in Opera to see the Flickering.</p>
	<p>Possible explanation:</p>
	<p>While Dragging the canvas div moves. After the dragging is complete the canvas div is moved back to ist original place.
	After the div is in its originial position, the features on the canvas are redrawn.</p>
	<p>Every Browser except Opera is not updating/rendering the screen while javascript is executing.
	Opera on the other hand does. So it updates the screen after the canvas div is moved to its original place but before the features are redrawn.</p>
	</div>
	</body>
	</html>