Несколько графиков MS на одной странице используют одну и ту же карту изображений - PullRequest
3 голосов
/ 07 февраля 2011

Я использую элемент управления Microsoft Chart, чтобы разместить пару диаграмм на веб-странице. Если вы отображаете 2 диаграммы, полученный HTML-код выглядит примерно так (таблица моя, img и map из MS Chart):

<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>

Обратите внимание, что обе карты используют одно и то же имя для карты изображений для каждой диаграммы - "ImageMap" - и в нем используются координаты от первой диаграммы на последующих диаграммах, даже если для каждого элемента используются разные заголовки.

Я делаю что-то не так, пытаясь отобразить 2 графика на 1 странице? Есть ли обходной путь для этого?

1 Ответ

4 голосов
/ 15 февраля 2011

Я только что столкнулся с точно такими же симптомами, используя 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");

Ваш код, вероятно, будет отличаться, если вы работаете со страницей не из MVC aspx, но я надеюсь, что этого будет достаточно, чтобы вы начали. Важно убедиться, что идентификаторы элементов управления для разных элементов управления диаграммы на одной и той же странице различны (поэтому я довольно жестоко использовал Guids).

Взгляните на http://msdn.microsoft.com/en-us/library/system.web.ui.control.clientidmode.aspx для альтернативных стратегий генерации идентификаторов управления - мой пример выше не единственный путь.

...