Fusion Chart swap

Question

Я попытался сделать своп-график обмена, но asp не нравится делать это. Итак, самое лучшее, что нужно сделать для рендеринга графика слияния, а затем с помощью onmousedown заменить диаграмму изображением. Только это не работает. Я попытался добавить div в код и использовать id, но обмен не работает. Я использовал «popChartDiv» в документе document.popChartDiv.src, но этот идентификатор является тем, что вызывает рендеринг для Literal3. Я не уверен, как переключить Literal3 с двумя div ниже (testimage.png и testimage1.png). Кажется, что диаграмма является фокусом, и изображения не могут переопределить график. Я также попытался использовать z-index, но это не сработало. Поэтому я застрял.

<div style="width:798px; margin-left:auto; margin-right:auto; height:250px; float:left; overflow:hidden;" id="popChartDiv"> 
    <script src="../../Dashboard/Charts/FusionCharts.js" type="text/javascript"></script> 
    <div id="popChartContainer"></div> 
    <asp:Literal ID="Literal3" Visible="true" runat="server"></asp:Literal> 
     <div id="line3ChartContainer"></div> 
     <asp:Literal ID="Literal9" Visible="true" runat="server"></asp:Literal> 
     <img src="/images/testimage.png" width="798" height="250" name="swap"/> 
</div> 
<div style="width:38px; height:250px; float:left;"> 
    <img src="../../images/labortab.png" style="float:left; width:38px; height:125px;" id="labor" onmousedown="document.swap.src='/images/testimage.png';"/> 
    <img src="../../images/odctab.png" style="float:left; width:38px; height:125px;" id="odc" onmousedown="document.swap.src='/images/testimage1.png';"/> 
    <script type="text/javascript"> 
     $('#labor').hover(function() { 
      $(this).attr('src', '/images/labortabhover.png'); 
     }, function() { 
      $(this).attr('src', '/images/labortab.png'); 
     }); 

     $('#odc').hover(function() { 
      $(this).attr('src', '/images/odctabhover.png'); 
     }, function() { 
      $(this).attr('src', '/images/odctab.png'); 
     }); 


     </script> 
</div> 

Answer 1

Если вы рендеринга графики на основе флэш, может быть, что оконный режим (wMode) устанавливается в window. Существует Adobe help article on SWF stacking order, в котором указано, что z-индекс объектов SWF игнорируется, когда параметр режима окна установлен на window.

В чистом ASP.NET (C#), если вы используете метод RenderChart, то вам необходимо установить девятый параметр в true (или false). Обратитесь к соответствующему разделу в разделе creating first chart using C# documentation article of FusionCharts.

Если вам удобнее работать с JavaScript, попробуйте позвонить setTransparent(false); на диаграмме, чтобы установить wMode непрозрачным или прозрачным.

Если предположить, что ваш график идентификатор line3Chart, код будет

<script type="text/javascript"> 
    // Add this code snippet. Make sure to replace 
    // "line3Chart with correct chart id 
    FusionCharts("line3Chart").setTransparent(false); 

    $('#labor').hover(function() { 
     $(this).attr('src', '/images/labortabhover.png'); 
    }, function() { 
     $(this).attr('src', '/images/labortab.png'); 
    }); 

    $('#odc').hover(function() { 
     $(this).attr('src', '/images/odctabhover.png'); 
    }, function() { 
     $(this).attr('src', '/images/odctab.png'); 
    }); 
</script>