Multiple MS charts on the same page use the same image card

I am using a Microsoft Chart control to place a couple of charts on a web page. If you put 2 diagrams, the resulting HTML code is something like this (mine table, img and map from MS table):

<table id="chart">
    <tr>
        <td id="rolling">
            <img src="/ChartImg.axd?i=chart_45ec7063132a47d9bf08ce377f4d6030_0.png&amp;g=d82064ecb0cf459dbda23039ae0c3f70" alt="" usemap="#ImageMap" style="height:200px;width:250px;border-width:0px;" />
<map name="ImageMap" id="ImageMap">

    <area shape="rect" coords="190,112,242,132" title="$321.01" alt="" />
    <area shape="rect" coords="59,69,111,132" title="$1,017.92" alt="" />
    <area shape="rect" coords="138,104,190,132" title="$449.04" alt="" />
    <area shape="rect" coords="7,25,59,132" title="$1,714.59" alt="" />
</map>
        </td>
        <td id="highrisk">
            <img src="/ChartImg.axd?i=chart_45ec7063132a47d9bf08ce377f4d6030_1.png&amp;g=6f876c9016cd4b72b5ba60609b9d05ec" alt="" usemap="#ImageMap" style="height:200px;width:250px;border-width:0px;" />
<map name="ImageMap" id="ImageMap">

    <area shape="rect" coords="190,128,242,132" title="41" alt="" />
    <area shape="rect" coords="59,131,111,132" title="6" alt="" />
    <area shape="rect" coords="138,25,190,132" title="922" alt="" />
    <area shape="rect" coords="7,121,59,132" title="100" alt="" />
</map>
        </td>
    </tr>
</table>

Note that both charts use the same name for the image map for each chart - “ImageMap” - and it uses the coordinates from the first chart in subsequent charts, even if it puts different captions for each element.

Am I doing something wrong trying to make 2 diagrams on 1 page? Is there a workaround for this?

+3
source share
1 answer

, ASP.Net 4, MVC 3, Razor ( ).

, , , Id , , . ( )

var chart = new System.Web.UI.DataVisualization.Charting.Chart();
chart.ClientIDMode = ClientIDMode.Static;
chart.ID = "Chart" + Guid.NewGuid().ToString("N");

, -, , aspx, MVC, , , . , ( Guids).

http://msdn.microsoft.com/en-us/library/system.web.ui.control.clientidmode.aspx - - .

+4

Source: https://habr.com/ru/post/1790529/


All Articles